題目1： dom對象的innerText和innerHTML有什么區別？

innerText是一個可寫屬性，返回元素內包含的文本內容，在多層次的時候會按照元素由淺到深的順序拼接其內容。

innerText 從起始位置到終止位置的內容, html標簽都被轉義后保存.

簡單場景：如果輸入框中有標簽的話，可以用innerText轉義，獲取內容

innerHTML屬性作用和innerText類似，但是不是返回元素的文本內容，而是返回元素的HTML結構，在寫入的時候也會自動構建DOM。

innerHTML 獲取從對象的起始位置到終止位置的全部內容,包括Html標簽

參考文

題目2： elem.children和elem.childNodes的區別？

children是Element的屬性，childNodes是Node的屬性，

1. children:
   非標準的，它返回指定元素的子元素集合。經測試，它只返回HTML節點，甚至不返回文本節點

 <div id="open">
    <h1>這是一張圖</h1>
    <img src="" alt="img">
    <button>open</button>
  </div>
  
var open= document.getElementById('open');
var d=open.children;
for(var i=0; i<d.length;i++){
     console.log(d[i])
}
輸出：
 <h1>?這是一張圖?</h1>?
<img src="" alt=?"img">?
 <button>?open?</button>?

2. childNodes:
   標準的，返回指定元素的子元素集合，包括HTML屬性，所有屬性，文本。可以通過nodeType來判斷是哪v 種類型的節點

var open= document.getElementById('open');
var d=open.childNodes;
    for(var i=0; i<d.length; i++){
         console.log(d[i])      
    }

 <h1>?這是一張圖?</h1>?
"hfhfhfhdhjshdfkshfksh"
 <img src(unknown) alt=?"img">?
 <button>?open?</button>?

補充：
　Node(節點)是DOM層次結構中的任何類型的對象的通用名稱，Node有很多類型，如元素節點，屬性節點，文本節點，注釋節點等，通過NodeType區分，常見的有：

題目3：查詢元素有幾種常見的方法？ES5的元素選擇方法是什么?

document.getElementById()//返回特定的id名的元素
document.getElementByClassName() //返回文檔中所有指定類名的元素集合，作為 NodeList 對象。
document.getElementByTagName()//獲取所有指定標簽的元素
document.getElementByName()//獲取所有指定name屬性值的元素

ES5 元素選擇方式：

document.querySelector() //返回匹配指定條件的第一個元素，，

document.querySelectorAll()//返回符合指定條件的所有元素，得到一個NodeList對象

題目4：如何創建一個元素？如何給元素設置屬性？如何刪除屬性

var node= document.createElement(' 標簽名稱 ');//創建一個html節點

node.setAtrribute('屬性名','設置的屬性值') //設置屬性

node.removeAtrribute('屬性名')

題目5：如何給頁面元素添加子元素？如何刪除頁面元素下的子元素?

<div id="open">
   <h1>這是一張圖</h1>
   <button>open</button>
 </div>

//div末尾添加一個p標簽
var node = document.querySelector('div')//現獲取要添加元素的標簽
var p= document.createElement('p');//創建一個新的段落元素
 node.appendChild(p)  //添加子元素

輸出結果：
<div id="open">
   <h1>這是一張圖</h1>
   <button>open</button>
   <p></p>  
 </div>

?

刪除子元素過程：

var node= document.querySelector(div)  //獲取要刪除子元素的元素
var p= document.getElementByTagName(p)  // 獲取刪除的元素
node.removeChild(p)  // 刪除操作

題目6： element.classList有哪些方法？如何判斷一個元素的 class 列表中是包含某個 class？如何添加一個class？如何刪除一個class?

var img= document.querySelector('images');

img.classList() //查看img元素的類名，返回一個數組
img.classList.add('active') //添加類名
img.classList.remove('active') //刪除類名
img.classList.contains('active')//是否包含active類名，返回true ,則是包含， 返回false，為不包含

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

<div class="mod-tabs">
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>
<button class="btn">點我</button>
</div>

注意： querySelectorAll（'參數'） //要求參數是字符串

var list= document.querySelectorAll('li') //獲取所有li
console.log(list)

var btn1=document.getElementByClaaName('btn')
console.log(btn1)