JavaScript元素の検索と方法の違い

開始
今日は自分のJSを固めることにしました.今の知識はまだばらばらです.特に深い内容は一度も見たことがありません.実戦で娘になれると思いますが、理論も多くのAPIもよく知らないので、基礎がしっかりしていないといけないと思います.知識を新たに更新し、学習内容を記録して、メモと今後自分で復習する内容とします.個人のホームページ:http://xkolento.cn 個人ブログ:https://weibo.com/1921492471/profile?rightmod=1&wvr=6&mod=personinfo
常用アプリ
1.一般的な要素の検索、各要素を制御するには、集合から循環する必要があります.

document.querySelector("body");//  body  
document.querySelector("#k");//  id k   
document.querySelector("#k span");//  id k        span  
document.querySelector("#k").querySelector("span");//  id k        span  
document.querySelectorAll("li");//    tagName li     （NodeList,                    ）
document.querySelectorAll("div .li");//  class li div

document.getElementById(id) //        ID          
getElementsByTagName() //                  
document.getElementsByClassName("example");                 
···


2.document.getElementById()   document.querySelector()    
①  getElementById     ，  querySelector      

KOLENTO

KOLENTO

KOLENTO

//demo 1 var ul=document.getElements ByTagName('ul')[0],lis=ul.getElements ByTagName(「li」);for(var i=0;i＜lis.length;i＋)｛ul.apped Child(document.create Element)｝consolie.logs(lis.length);6,もとの3つのノードに後続の追加を加えて、全部で6つです.
//demo 2 var ul=document.querySelectorAll('ul')、lis=l.querySelectorAll(「li」);for(var i=0;i＜lis.length;i＋)｛ul.apped Child(document.create Element)｝consolie.logs(lis.length);3,元の3つのノードだけを取得して、新たに追加されたものは取得できません.

②     
  ：console.time console.timeEnd          WEB        javascript           。
console.time         ，console.timeEnd     ，         。

consolie.time('querySelector')for(var i=0;i<100000;i+){document.querySelector(「咻菗wpuditbtns」);consolie.timeEnd('querySelector')//querySelector:519 ms
consone.time('getElementById')for(var i=0;i<100000;i+){document.getElement ById("wpuueditbtns");consolie.timeEnd('getElement ById');getElemenntById:491 ms
consolie.time('querySelectorAll')for(var i=0;i<10000;i+){document.querySelectorAll];consolie.timeEnd('querySelectorAll');querySelectorAll:1781 ms
consone.time('getElements ByClass Name')for(var i=0;i<10000;i+){document.getElements ByClass Name];sone.timeEnd('getElements ByClass Name');get Elements ByClass Name:54 ms

3.jq           
  ：$('p')，    p  ， jquery     jq  。
                   ， document.getElementsByTagName()、querySelector  。

##  
            ，getElementById      ，      ，  jquery，      jqmobi             querySelector，   ，                    ，    getElementById