dom對(duì)象的innerText和innerHTML有什么區(qū)別燎猛？

innerText是一個(gè)可寫(xiě)屬性动知，返回元素內(nèi)包含的文本內(nèi)容，在多層次的時(shí)候會(huì)按照元素由淺到深的順序拼接其內(nèi)容

innerHTML屬性作用和innerText類似，但是不是返回元素的文本內(nèi)容蚣常，而是返回元素的HTML結(jié)構(gòu)，在寫(xiě)入的時(shí)候也會(huì)自動(dòng)構(gòu)建DOM

elem.children和elem.childNodes的區(qū)別痊银？

element.children返回一個(gè)由子元素節(jié)點(diǎn) (只是元素節(jié)點(diǎn)) 構(gòu)成的集合
children 屬性為只讀屬性抵蚊，對(duì)象類型為 HTMLCollection，你可以使用 elementNodeReference.children[1].nodeName 來(lái)獲取某個(gè)子元素的標(biāo)簽名稱溯革。

element.childNodes返回包含指定節(jié)點(diǎn)的子節(jié)點(diǎn)的集合,（是子節(jié)點(diǎn)不光是子元素節(jié)點(diǎn)）該集合為即時(shí)更新的集合 為NodeList 類型贞绳，且為只讀

查詢?cè)赜袔追N常見(jiàn)的方法？ES5的元素選擇方法是什么?

document.getElementById()
如果沒(méi)有查找到對(duì)應(yīng)的元素致稀，方法會(huì)返回null冈闭。注意ID參數(shù)是大小寫(xiě)敏感的，所以document.getElementById("Main")無(wú)法獲取到元素<div id="main">抖单，因?yàn)?M'和'm'是不一樣的萎攒。
getElementById方法不會(huì)搜索不在文檔中的元素遇八。當(dāng)創(chuàng)建一個(gè)元素，并且分配ID后耍休，你必須要使用insertBefore或其他類似的方法把元素插入到文檔中之后才能使用 getElementById 獲取到

document.getElementsByTagName()
方法返回一個(gè)動(dòng)態(tài)的包含所有指定標(biāo)簽名的元素的HTML集合HTMLCollection刃永。指定的元素的子樹(shù)會(huì)被搜索，不包括元素自己羹应。返回的列表是動(dòng)態(tài)的揽碘，這意味著它會(huì)隨著DOM樹(shù)的變化自動(dòng)更新自身。所以园匹，使用相同元素和相同參數(shù)時(shí)雳刺，沒(méi)有必要多次的調(diào)用Element.getElementsByTagName()

document.getElemenstByClassName()
返回一個(gè)類似數(shù)組的對(duì)象，包含了所有指定 class 名稱的子元素（HTMLCollection類型的對(duì)象）裸违。當(dāng)調(diào)用發(fā)生在document對(duì)象上時(shí), 整個(gè)DOM都會(huì)被搜索, 包含根節(jié)點(diǎn)掖桦。你也可以在任意元素上調(diào)用getElementsByClassName() 方法，它將返回的是以當(dāng)前元素為根節(jié)點(diǎn)(搜索范圍包含自己)供汛，所有指定class名稱的子元素枪汪。

document.getElementsByClassName('test shake');  class名稱通過(guò)空格分隔

document.getElementsByName
用于選擇擁有name屬性的HTML元素，比如form怔昨、img雀久、frame、embed和
object趁舀，返回一個(gè)NodeList格式的對(duì)象赖捌，不會(huì)實(shí)時(shí)反映元素的變化。

ES5
document.querySelector()返回匹配指定的CSS選擇器的元素節(jié)點(diǎn)矮烹。如果有多個(gè)節(jié)點(diǎn)滿足匹配條件越庇，則返回第一個(gè)匹配的節(jié)點(diǎn)。如果沒(méi)有發(fā)現(xiàn)匹配的節(jié)點(diǎn)奉狈，則返回null卤唉。
document.querySelectorAll()querySelectorAll方法返回匹配指定的CSS選擇器的所有節(jié)點(diǎn)，返回的是NodeList類型的對(duì)象仁期。NodeList對(duì)象不是動(dòng)態(tài)集合桑驱，所以元素節(jié)點(diǎn)的變化無(wú)法實(shí)時(shí)反映在返回結(jié)果中。

如何創(chuàng)建一個(gè)元素蟀拷？如何給元素設(shè)置屬性碰纬？如何刪除屬性

document.createElement('div') 

element.setAttribute('align','center')
如果屬性已經(jīng)存在，則更新該值; 否則將添加一個(gè)新的屬性用指定的名稱和值

element.removeAttribute('align')

如何給頁(yè)面元素添加子元素问芬？如何刪除頁(yè)面元素下的子元素?

Node.appendChild() 方法將一個(gè)節(jié)點(diǎn)添加到指定父節(jié)點(diǎn)的子節(jié)點(diǎn)列表末尾
var child = node.appendChild(child);
node 是要插入子節(jié)點(diǎn)的父節(jié)點(diǎn) child 即是參數(shù)又是這個(gè)方法的返回值.
appendChild 方法會(huì)把要插入的這個(gè)節(jié)點(diǎn)引用作為返回值返回喲
// 創(chuàng)建一個(gè)新的段落p元素,然后添加到body的最尾部
var p = document.createElement("p");
document.body.appendChild(p);

Node.removeChild() 方法從DOM中刪除一個(gè)子節(jié)點(diǎn)。返回刪除的節(jié)點(diǎn)
Node為參數(shù)的父節(jié)點(diǎn) 參數(shù)為要?jiǎng)h除的節(jié)點(diǎn)
let oldChild = node.removeChild(child);
//OR
element.removeChild(child);
被移除的這個(gè)子節(jié)點(diǎn)仍然存在于內(nèi)存中,只是沒(méi)有添加到當(dāng)前文檔的DOM樹(shù)中,因此,你還可以把這個(gè)節(jié)點(diǎn)重新添加回文檔中
當(dāng)然,實(shí)現(xiàn)要用另外一個(gè)變量比如上例中的oldChild來(lái)保存這個(gè)節(jié)點(diǎn)的引用. 如果使用上述語(yǔ)法中的第二種方法
即沒(méi)有使用 oldChild 來(lái)保存對(duì)這個(gè)節(jié)點(diǎn)的引用, 則認(rèn)為被移除的節(jié)點(diǎn)已經(jīng)是無(wú)用的, 在短時(shí)間內(nèi)將會(huì)被內(nèi)存管理回收

element.classList有哪些方法寿桨？如何判斷一個(gè)元素的 class 列表中是包含某個(gè) class此衅？如何添加一個(gè)class强戴？如何刪除一個(gè)class

Element.classList 是一個(gè)只讀屬性,返回一個(gè)元素的類屬性的實(shí)時(shí)DOMTokenList集合。
方法
add( String [, String] )
添加指定的類值挡鞍。如果這些類已經(jīng)存在于元素的屬性中骑歹，那么它們將被忽略。
remove( String [,String] )
刪除指定的類值墨微。
item ( Number )
按集合中的索引返回類值道媚。
toggle ( String [, force] )
當(dāng)只有一個(gè)參數(shù)時(shí)：切換 class value; 即如果類存在，則刪除它并返回false翘县，如果不存在最域，則添加它并返回true。
當(dāng)存在第二個(gè)參數(shù)時(shí)：如果第二個(gè)參數(shù)的計(jì)算結(jié)果為true锈麸，則添加指定的類值镀脂，如果計(jì)算結(jié)果為false，則刪除它
contains( String )
檢查元素的類屬性中是否存在指定的類值忘伞。

如何選中如下代碼所有的li元素薄翅？ 如何選中btn元素？

<div class="mod-tabs">
  <ul>
   <li>list1</li>
   <li>list2</li>
   <li>list3</li>
  </ul>
  <button class="btn">點(diǎn)我</button>
</div>

  var allLi = document.getElementsByTagName('li')
  var theBtn = document.getElementsByClass('btn')

  document.querySelectorAll('li')
  document.querySelector('.btn')