Imitieren Sie querySeletor wirklich, um Kompatibilität mit IE 67 zu erreichen-js-Tutorial-php.cn

Imitieren Sie querySeletor wirklich, um Kompatibilität mit IE 67 zu erreichen

不言

Freigeben： 2018-07-14 15:48:17

Original

1301 Leute haben es durchsucht

Dieser Artikel stellt hauptsächlich vor, wie man querySeletor originalgetreu nachahmt, um Kompatibilität mit IE 67 zu erreichen. Jetzt kann ich ihn mit allen teilen, die ihn brauchen.

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

Nach dem Login kopieren

Das Obige ist Ich hoffe, dass der gesamte Inhalt dieses Artikels zum Lernen aller beiträgt. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website!

Verwandte Empfehlungen:

So verwenden Sie native JS zur Implementierung von Ajax

Analyse von Sizzle, der Auswahl-Engine in jQuery

Das obige ist der detaillierte Inhalt vonImitieren Sie querySeletor wirklich, um Kompatibilität mit IE 67 zu erreichen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!