1 dom對象的innerText
和innerHTML
有什么區(qū)別?
innerText
返回元素內(nèi)的的文本內(nèi)容,innerHTML
返回元素內(nèi)的HTML結(jié)構(gòu)(不包括元素本身)
2 elem.children
和elem.childNodes
的區(qū)別?
elem.childNodes
返回所有的子節(jié)點,包括HTML元素,屬性,文本.
elem.childNodes
只返回HTML元素節(jié)點
3 查詢元素有幾種常見的方法?ES5的元素選擇方法是什么?
常見方法
getElementById()
通過ID查詢元素
getElementsByClassName()
通過class查詢元素
getElementsByTagName()
通過標簽查詢元素
getElementsByName()
通過選擇有name屬性的元素查詢元素
es5
querySelector()
通過匹配指定的CSS選擇器的元素節(jié)點查詢元素
querySelectorAll()
通過匹配指定的CSS選擇器的所有節(jié)點查詢元素
4 如何創(chuàng)建一個元素?如何給元素設(shè)置屬性?如何刪除屬性
創(chuàng)建元素
createElement()
設(shè)置元素屬性
setAttribute()
刪除屬性
romoveAttribute()
5 如何給頁面元素添加子元素?如何刪除頁面元素下的子元素?
添加子元素到元素末尾
appendChild()
刪除頁面元素下的子元素
removeChild()
6 element.classList有哪些方法?如何判斷一個元素的 class 列表中是包含某個 class?如何添加一個class?如何刪除一個class?
方法
add():添加一個類名
item(index):查找第index個類名
remove(className):刪除一個類名
contains(className):是否包含指定類名,返回布爾值
contains(className)判斷一個元素的 class 列表中是包含某個 class,包含返回true,不包含返回false.
remove(className)用來刪除一個class.
7 如何選中如下代碼所有的li元素? 如何選中btn元素?
<div class="mod-tabs">
<ul>
<li>list1<li>
<li>list2<li>
<li>list3<li>
</ul>
<button class="btn">點我</button>
</div>
var list = document.getElementsByTagName('li');
console.log(list);
var btn = document.getElementsByClassName('btn');
console.log(btn);
var list1 = document.querySelectorAll('li');
console.log(list1);
var btn1 = document.querySelector(".btn");
console.log(btn1);