简单封装一下选择器
HTML代码：
<body>
<div class="box">
<div class="first">11111</div>
<div class="second">aaaaa</div>
<div class="second">bbbbb</div>
<div id="third">33333</div>
<p>标签名实验</p>
</div>
</body>
js代码：
function $(param, obj) {
obj = obj || document;
//根据id名查找元素
if (param[0] === "#")
// console.log("param.charAt(0) == param[0]",param.charAt(0))
return document.getElementById(param.slice(1));
// 根据指定类名查找元素
if (param.indexOf(".") === 0)
return getByClass(param.substring(1), obj);
//根据标签名查找
return obj.getElementsByTagName(param);
}
//类名查找元素实现方法
function getByClass(className, obj) {
obj = obj || document;
if (obj.getElementsByClassName)
return obj.getElementsByClassName(className);
var result = [];
var tags = obj.getElementsByTagName("*");
for (var i = 0, len = tags.length; i < len; i++) {
var classNames = tags[i].className.split(" "); // 获取当前遍历元素的类名
for (var j = 0, l = classNames.length; j < l; j++) {
if (className === classNames[j]) { // 找到所需要进行查找的一个元素
result.push(tags[i]);
break;
}
}
}
return result;
}
测试：
$("#third").style.color= "red";
$(".second")[0].style.color = "blue";
$("p")[0].style.color= "green";
892
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
