題目1： dom對象的innerText和innerHTML有什么區(qū)別？
innerText是一個可寫屬性，返回元素內(nèi)包含的文本內(nèi)容妇萄，在多層次的時候會按照元素由淺到深的順序拼接其內(nèi)容子寓。
innerHTML屬性作用和innerText類似，但是不是返回元素的文本內(nèi)容滑废，而是返回元素的HTML結(jié)構(gòu)，在寫入的時候也會自動構(gòu)建DOM袜爪。
例如：
<div>
<p>
123
<span>456</span>
</p>
</div>
外層div的innerText返回內(nèi)容是 "123456"蠕趁。
外層div的innerHTML返回內(nèi)容是 "<p>123<span>456</span></p>"。
題目2： elem.children和elem.childNodes的區(qū)別辛馆？
children 屬性俺陋，非標(biāo)準的，它返回指定元素的子元素集合昙篙。經(jīng)測試腊状，它只返回HTML節(jié)點，甚至不返回文本節(jié)點苔可。和childNodes 一樣缴挖，在Firefox下不支持()取集合元素。需注意children在IE中包含注釋節(jié)點焚辅。
childNodes 屬性映屋，標(biāo)準的苟鸯，它返回指定元素的子元素集合，包括HTML節(jié)點棚点，所有屬性早处，文本√蔽觯可以通過nodeType來判斷是哪種類型的節(jié)點徊哑，只有當(dāng)nodeType==1時才是元素節(jié)點，2是屬性節(jié)點但壮，3是文本節(jié)點征绸。
題目3：查詢元素有幾種常見的方法？ES5的元素選擇方法是什么?
getElementById()
var elem = document.getElementById("test");
getElementById方法返回匹配指定ID屬性的元素節(jié)點甘有。如果沒有發(fā)現(xiàn)匹配的節(jié)點诉儒，則返回null。getElementsByClassName()
var elements = document.getElementsByClassName(names);
getElementsByClassName方法返回一個類似數(shù)組的對象（HTMLCollection類型的對象）亏掀，包括了所有class名字符合指定條件的元素（搜索范圍包括本身）忱反，元素的變化實時反映在返回結(jié)果中。
document.getElementsByClassName('red test');
getElementsByClassName方法的參數(shù)滤愕，可以是多個空格分隔的class名字温算，返回同時具有這些節(jié)點的元素。getElementsByTagName()
var paras = document.getElementsByTagName("p");
getElementsByTagName方法返回所有指定標(biāo)簽的元素（搜索范圍包括本身）间影。返回值是一個HTMLCollection對象注竿，也就是說，搜索結(jié)果是一個動態(tài)集合魂贬，任何元素的變化都會實時反映在返回的集合中巩割。getElementsByName()
getElementsByName方法用于選擇擁有name屬性的HTML元素，比如form付燥、img宣谈、frame、embed和object键科，返回一個NodeList格式的對象闻丑，不會實時反映元素的變化。
// 假定有一個表單是<form name="x"></form>
var forms = document.getElementsByName("x");
forms[0].tagName // "FORM"
注意勋颖，在IE瀏覽器使用這個方法嗦嗡，會將沒有name屬性、但有同名id屬性的元素也返回饭玲，所以name和id屬性最好設(shè)為不一樣的值侥祭。
querySelector()
var el1 = document.querySelector(".myclass");
var el2 = document.querySelector('#myParent > [ng-click]');
querySelector方法返回匹配指定的CSS選擇器的元素節(jié)點。如果有多個節(jié)點滿足匹配條件，則返回第一個匹配的節(jié)點卑硫。
querySelector方法無法選中CSS偽元素徒恋。querySelectorAll()
elementList = document.querySelectorAll(selectors);
querySelectorAll方法返回匹配指定的CSS選擇器的所有節(jié)點，返回的是NodeList類型的對象欢伏。NodeList對象不是動態(tài)集合入挣，所以元素節(jié)點的變化無法實時反映在返回結(jié)果中。elementFromPoint()
var element = document.elementFromPoint(x, y);
返回位于頁面指定位置的元素硝拧。參數(shù)x和y径筏，分別是相對于當(dāng)前窗口左上角的橫坐標(biāo)和縱坐標(biāo)，單位是CSS像素障陶。
ES5的元素選擇方法：
querySelector()方法
querySelectorAll()方法
題目4：如何創(chuàng)建一個元素滋恬？如何給元素設(shè)置屬性？如何刪除屬性抱究。
創(chuàng)建元素：
createElement()
var newDiv = document.createElement("div");
createElement方法用來生成HTML元素節(jié)點恢氯。
createElement方法的參數(shù)為元素的標(biāo)簽名，即元素節(jié)點的tagName屬性鼓寺。如果傳入大寫的標(biāo)簽名勋拟，會被轉(zhuǎn)為小寫。如果參數(shù)帶有尖括號（即<和>）或者是null妈候，會報錯敢靡。createTextNode()
var newContent = document.createTextNode("Hello");
createTextNode方法用來生成文本節(jié)點，參數(shù)為所要生成的文本節(jié)點的內(nèi)容苦银。createDocumentFragment()
var docFragment = document.createDocumentFragment();
createDocumentFragment方法生成一個DocumentFragment對象啸胧。
DocumentFragment對象是一個存在于內(nèi)存的DOM片段，但是不屬于當(dāng)前文檔幔虏，常常用來生成較復(fù)雜的DOM結(jié)構(gòu)纺念，然后插入當(dāng)前文檔。這樣做的好處在于所计，因為DocumentFragment不屬于當(dāng)前文檔柠辞，對它的任何改動，都不會引發(fā)網(wǎng)頁的重新渲染主胧，比直接修改當(dāng)前文檔的DOM有更好的性能表現(xiàn)。
設(shè)置元素屬性：
setAttribute()
刪除屬性：
romoveAttribute()
題目5：如何給頁面元素添加子元素习勤？如何刪除頁面元素下的子元素?
添加元素：
appendChild()
在元素末尾添加元素
var newDiv = document.createElement("div");
var newContent = document.createTextNode("Hello");
newDiv.appendChild(newContent);insertBefore()
在某個元素之前插入元素
var newDiv = document.createElement("div");
var newContent = document.createTextNode("Hello");
newDiv.insertBefore(newContent, newDiv.firstChild);replaceChild()
replaceChild()接受兩個參數(shù)：要插入的元素和要替換的元素
newDiv.replaceChild(newElement, oldElement);
刪除元素：
removeChild()
parentNode.removeChild(childNode);
題目6： element.classList有哪些方法踪栋？如何判斷一個元素的 class 列表中是包含某個 class？如何添加一個class图毕？如何刪除一個class?
方法：
add( String [, String] )
添加指定的類值夷都。如果這些類已經(jīng)存在于元素的屬性中，那么它們將被忽略予颤。remove( String [,String] )
刪除指定的類值囤官。item ( Number )
按集合中的索引返回類值冬阳。toggle ( String [, force] )
當(dāng)只有一個參數(shù)時：切換 class value; 即如果類存在，則刪除它并返回false党饮，如果不存在肝陪，則添加它并返回true。
當(dāng)存在第二個參數(shù)時：如果第二個參數(shù)的計算結(jié)果為true刑顺，則添加指定的類值氯窍，如果計算結(jié)果為false，則刪除它蹲堂。contains( String )
檢查元素的類屬性中是否存在指定的類值狼讨。
contains( String )判斷一個元素的 class 列表中是包含某個 class。
add( String [, String] )添加一個class柒竞。
remove( String [,String] )刪除一個class政供。
題目7： 如何選中如下代碼所有的li元素？ 如何選中btn元素朽基？
<div class="mod-tabs">
<ul>
<li>list1<li>
<li>list2<li>
<li>list3<li>
</ul>
<button class="btn">點我</button>
</div>
選中所有l(wèi)i元素：
document.querySelectorAll('li')
document.getElementsByTagName('li')
選中btn元素：
document.querySelectorAll('.btn')
document.getElementsByClassName('btn')
Node與Element的區(qū)別：
Node(節(jié)點)是DOM層次結(jié)構(gòu)中的任何類型的對象的通用名稱布隔，Node有很多類型，如元素節(jié)點踩晶，屬性節(jié)點执泰，文本節(jié)點，注釋節(jié)點等渡蜻，通過NodeType區(qū)分术吝。
Element繼承了Node類，也就是說Element是Node多種類型中的一種茸苇，即當(dāng)NodeType為1時Node即為ElementNode排苍，另外Element擴展了Node，Element擁有id学密、class淘衙、children等屬性。
children是Element的屬性腻暮，childNodes是Node的屬性
