关于函数封装

<!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>
// rua为函数名称 ul为ul的id a为li里面的class类名前面是父元素，后面子元素
function rua(ul,a) {
// 选定ul 并且声明ul
var oUL = document.getElementById(ul);
// 选择ul中所有的标签元素（*代表所有）
var arrLi = oUL.getElementsByTagName("*");
// 新建一个空数组
var arLII = [];
// 循环arrLi中的所有元素
for (var i = 0; i < arrLi.length; i++) {
// 将之前选中的元素类名转化为数组，并且新建在一个数组中
var arrString = arrLi[i].className.split(" ");
// j代表遍历所有arrString中的元素
for (j in arrString) {
// 判断数组中是否有class为a的数值
if (arrString[j] == a) {
// 如果有class为a的数值则将该数值添加到空数值中
arLII.push(arrLi[i])
}
}

}

// 返回数组arLII
return arLII;

}
// 前面已经找到的数组，让这些数组所在的元素遍历一遍
for (var i = 0; i <rua("ul","a").length; i++) {
// 让这些选中的class中带有a的背景颜色改成红色
rua("ul","a")[i].style.background = "red";
}
</script>
</body>
</html>

猜你喜欢