如实仿querySeletor来实现兼容IE 67-js教程-PHP中文网

如实仿querySeletor来实现兼容IE 67

不言

发布： 2018-07-14 15:48:17

原创

1469人浏览过

这篇文章主要介绍了关于如实仿queryseletor来实现兼容ie 67，有着一定的参考价值，现在分享给大家，有需要的朋友可以参考一下

<!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>

登录后复制

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！