一、 dom對象的innerText和innerHTML有什么區別?
innerText返回的是元素包含的文本內容,忽略所有的標簽,在多層次時會按照元素由潛到深的順序拼接內容,用于返回純文本形式的內容。
innerHTML返回的元素包含標簽,且不包含元素本身
二、 elem.children和elem.childNodes的區別?
elem.chidren是只讀的類數組對象(NodeList對象),它是該節點的子節點的實時表示。children只包含Element元素,并非標準屬性。elem.children表示的是elem所有元素,忽略空格等文本節點,只顯示元素。
elem.childNodes也是一個NodeList對象。elem.childNodes表示的是elem所有元素,包括空格等文本節點,顯示真正意義上的所有元素。
三、查詢元素有幾種常見的方法?ES5的元素選擇方法是什么?
1、查詢元素的常見方法有;
通過id屬性查找元素,document.getElementById('btn')
通過class屬性查找元素,document.getElementsByClassName('btn-1')
通過名字name屬性查找元素,document.getElementsByName('abc')
通過標簽TagName 屬性查找元素,document.getElementsByTagName('h1')
2/ES5的元素選擇方法是;
document.querySelector('#btn')
document.querySelectorAll('#btn')
四、如何創建一個元素?如何給元素設置屬性?如何刪除屬性
createElement()//創建元素,在內存中的DOM,并未在頁面上
setAttribute()//如果屬性未存在,為添加屬性,如果屬性已存在,為修改屬性
removeAttribute()//刪除屬性
五、如何給頁面元素添加子元素?如何刪除頁面元素下的子元素?
appendChild()再元素末尾添加元素
removeChild()刪除元素
insertBefore()在某個元素之前插入元素
repalceChlid()接受兩個參數,要插入的參數和要替換的參數
六、 element.classList有哪些方法?如何判斷一個元素的 class 列表中是包含某個 class?如何添加一個class?如何刪除一個class?
element.classList方法:
添加指定類型的值(如已存在將被忽略):add
刪除指定類型的值:remove
確實一個元素的class列表是否包含某個class:contains
按集合中的索引返回類值:item
當只有第一個參數時,當class值存在時,刪除class值返回false,當class不存在時,添加該參數作為class值,并返回true;當第二個參數存在時,當第二個參數的結果為true時,添加class值,當計算結果為false時,刪除第一參數對應的class :toggle
七、 如何選中如下代碼所有的li元素? 如何選中btn元素?
<div class="mod-tabs">
<ul>
<li>list1<li>
<li>list2<li>
<li>list3<li>
</ul>
<button class="btn">點我</button>
</div>