函数封装!

  <!DOCTYPE html>
  <html lang="en">
  <head>
  <meta charset="UTF-8">
  <title>Title</title>
   
  </head>
  <body>
  <ul id="ul">
  <li class="a abc abcd abcde ">1</li>
  <li class="c a">2</li>
  <li class="aa">3</li>
  <li class="a c b r f">4</li>
  <li class="b">5</li>
  </ul>
  <script>
  function rua(ul,a) {
  // rua为函数名称 ul为ul的id a为li里面的class类名 前面是父元素,后面子元素
  var oUL = document.getElementById(ul);
  // 选定ul 并且声明ul
  var arrLi = oUL.getElementsByTagName("*");
  // 选择ul中所有的(*代表所有)标签元素
  var arLII = [];
  // 新建一个空数组
  for (var i = 0; i < arrLi.length; i++) {
  // 循环arrLi中的所有元素
  var arrString = arrLi[i].className.split(" ");
  // 将之前选中的元素类名转化为数组 并且新建在一个数组中
  for (j in arrString) {
  // j代表遍历所有arrString中的元素
  if (arrString[j] == a) {
  // 判断数组中是否有class为a的数值
  arLII.push(arrLi[i])
  // 如果有class为a的数值 则将该数值添加到空数值中
  }
  }
  }
  return arLII;
  // 返回数组arLII
  }
  for (var i = 0; i <rua("ul","a").length; i++) {
  // 前面已经找到的数组,让这些数组所在的元素遍历一遍
  rua("ul","a")[i].style.background = "red";
  // 让这些选中的class中带有a的背景颜色改成红色
  }
  </script>
  </body>
  </html>

猜你喜欢

转载自blog.csdn.net/le_oop/article/details/80818980