正文
模拟Jquery选择器
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
目前实现的功能有以下几点：
1.$("#adom"); // 返回id为adom的DOM对象
2.$("a"); // 返回一个a标签的数组
3.$(".classa"); // 返回一个class的数组
4.$("[data-log]"); // 返回一个包含属性data-log的数组
5.$("[data-time=2015]"); // 返回一个属性为data-time且值为2015的数组
其他选择器有时间在弄吧。
function $() {
var a = arguments,len,str,sub,dataReg;
// class兼容IE
function classN(n){
var tag = document.getElementsByTagName("*");
for(var i=0,arr=[];i<tag.length;i++){
if(tag[i].className.indexOf(n)!==-1){
arr.push(tag[i]);
}
}
return arr;
}
// 自定义data选择器
function data(d){
var tag = document.getElementsByTagName("*");
var reg = /\-([\d\w]+)\]/;
for(var i=0,arr=[];i<tag.length;i++){
if(tag[i].dataset[reg.exec(d)[1]]){
arr.push(tag[i]);
}
}
return arr;
}
// 自定义data选择器严格版
function dataT(d){
var tag = document.getElementsByTagName("*");
var reg = /\[data\-([\w\d]+)\=([\w\d]+)/;
for(var i=0,arr=[];i<tag.length;i++){
if(tag[i].dataset[reg.exec(d)[1]]===reg.exec(d)[2]){
arr.push(tag[i]);
}
}
return arr;
}
// 如果是函数，将函数添加到load事件中
if((typeof a[0])==="function"){
window.addEventListener('load',a[0]);
}else{
len = a.length;
str = a[0].charAt(0);
sub = a[0].substring(1);
dataReg = /\=/.test(a[0]);
switch(str){
case "#":
return document.getElementById(sub);
break;
case ".":
return classN(sub);
break;
case "[":
switch(dataReg){
case false:
return data(a[0]);
break;
case true:
return dataT(a[0]);
break;
}
break;
default:
return document.getElementsByTagName(a[0]);
break;
}
}
}
