我有以下功能,当触发时会使DIV变为半透明.
- function changeOpacity(el) {
- var elem = document.getElementById(el);
- elem.style.transition = "opacity 0.5s linear 0s";
- elem.style.opacity = 0.5;
- }
但是我希望这个功能可以同时应用于多个DIV.我尝试给每个DIV相同的类名,然后使用getElementsByClassName,但无法弄清楚如何实现它.
querySelectorAll会更合适,如果是这样,我将如何实现它？
解决方法
我会用querySelectorAll选择它们并循环它们.
- function changeOpacity(className) {
- var elems = document.querySelectorAll(className);
- var index = 0,length = elems.length;
- for ( ; index < length; index++) {
- elems[index].style.transition = "opacity 0.5s linear 0s";
- elems[index].style.opacity = 0.5;
- }
- }
编辑：正如上面所说的评论,如果它们不是动态的并且使用以下内容,那么最好将这些值放在一个类中：
- elems[index].classList.add('someclass');
