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

• innerText返回的是元素內(nèi)的純文本內(nèi)容，多層次時(shí)由淺入深的排序內(nèi)容
• innerHTML返回是該元素文本內(nèi)容和內(nèi)部標(biāo)簽及內(nèi)容

js-console

2、elem.children和elem.childNodes的區(qū)別？

console

DOM中，children是文檔對(duì)象中的子對(duì)象，不包含tag之間隱形存在的textNode，而childNodes包括tag之間的隱形存在的textNode對(duì)象

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

• 查詢?cè)氐某Ｒ?jiàn)方法

getElementById()             //返回一個(gè)指定ID屬性的元素節(jié)點(diǎn)
getElementByTagName()        //返回一個(gè)對(duì)象數(shù)組，每個(gè)對(duì)象分別對(duì)應(yīng)文檔有著給定標(biāo)簽的一個(gè)元素
getElementByClassName()      //返回一個(gè)具有相同類名的元素的數(shù)組
getElementsByName()          //返回?fù)碛衝ame屬性的HTML元素           

• ES5的元素選擇方法

querySelector()      //返回指定的CSS選擇器的元素節(jié)點(diǎn)
querySelectorAll()     //返回指定的CSS選擇器的所有節(jié)點(diǎn)

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

• 創(chuàng)建元素：createElement()生成HTML元素節(jié)點(diǎn)
• 獲取元素屬性值：getAttribute()
• 設(shè)置元素屬性值：setAttribute()
• 刪除元素屬性：removeAttribute()

5、如何給頁(yè)面元素添加子元素？如何刪除頁(yè)面元素下的子元素？

appendChild()         //在元素末尾添加元素
insertBefore()        //在某個(gè)元素之前插入元素
removeChild()         //刪除某元素下的子元素
replaceChild()        //可以接受兩個(gè)參數(shù)，要插入的元素和要替換的元素

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

element.classList.contains(class)           //返回布爾值，判斷指定的類名是否存在
element.classList.add(class1,class2,...)             //在元素中添加一個(gè)或多個(gè)不存在的類名
element.classList.remove(class1,class2,...)  
//在元素中移除一個(gè)或多個(gè)類名
element.classList.item(index)
//返回索引值對(duì)應(yīng)的元素類名。從 0 開(kāi)始，在區(qū)間范圍外則返回 null。

7、如何選中如下代碼所有的li元素？ 如何選中btn元素？

例子

解答