Home > Article > Web Front-end > Really imitate querySeletor to achieve compatibility with IE 67
Really imitate querySeletor to achieve compatibility with IE 67
- 不言Original
- 2018-07-14 15:48:171269browse
This article mainly introduces the truthful imitation of querySeletor to achieve compatibility with IE 67. It has a certain reference value. Now I share it with everyone. Friends in need can refer to it
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>仿Jquery查询</title>
</head>
<body>
<div id="box">
<ul id="ulBox" class="ulBox" >
<li></li>
<li></li>
<li></li>
</ul>
</div>
<script type="text/javascript" src="DomUtil.js"></script>
<script type="text/javascript">
function $(str){
/*#box .ulBox li*/
/*
var currentEle=document;
先取到#box 然后得到#box元素
保存在currentEle中
然后在#box元素下取到.ulBox
考虑到类不是一个 所以一般取第一个操作就行
$(".box")[0]
保存在currentEle中
然后在ul.box 下取到 li
保存在currentEle中
每次查到元素 都要保存在一个变量中以便下次搜索时用
符串是用空格分开的
所以可以用 str.split(" ")分成好几个在遍历操作;
*/
currentEle=document;//保存每次查询的元素节点
var arr=str.split(" ");//把字符串按空格分开变成数组
var len=arr.length;
for(var i=0;i<len;i++)
{
var firstSign = arr[i].substr(0,1);
if(firstSign!="." && firstSign!="#" )
{
var name=arr[i].substr(0);
}
else{
var name =arr[i].substr(1);
}
switch(firstSign)
{
case "." : currentEle=getElementsByClassName(name)[0];
break;
case "#" : currentEle=currentEle.getElementById(name);
break;
default : currentEle=currentEle.getElementsByTagName(name);
}
}
return currentEle;
}
console.log($(".box .ulBox li"));
</script>
</body>
</html>The above is the entire content of this article , I hope it will be helpful to everyone’s learning. For more related content, please pay attention to the PHP Chinese website!
Related recommendations:
How to use native js to implement Ajax
Parsing of the selector engine Sizzle in jQuery
The above is the detailed content of Really imitate querySeletor to achieve compatibility with IE 67. For more information, please follow other related articles on the PHP Chinese website!