時(shí)間：2019/10/13

排他思想（算法）：for循環(huán)給每個(gè)相同標(biāo)簽子元素綁定事件，點(diǎn)擊某個(gè)標(biāo)簽前先for循環(huán)把同級所有標(biāo)簽樣式初始化，然后再給這個(gè)標(biāo)簽添加特定樣式。

1.表單checkbox全選與全取消思路：給主控checkbox綁定點(diǎn)擊事件，for循環(huán)子項(xiàng)checkbox，并將主控的checked屬性值賦給每一個(gè)子項(xiàng)的checked屬性。
2.表單checkbox子項(xiàng)影響總控checkbox思路：for循環(huán)給每個(gè)子項(xiàng)checkbox綁定點(diǎn)擊事件，每次點(diǎn)擊都for循環(huán)查看子項(xiàng)所有的checkbox有沒有選中，如有一個(gè)沒選中，那么總控checkbox不選中。
3.tab欄切換思路：給每一個(gè)tab選項(xiàng)添加自定義屬性data-index表示當(dāng)前序號，在綁定的點(diǎn)擊事件里給相應(yīng)序號的內(nèi)容模塊添加顯示屬性。

5).節(jié)點(diǎn)操作（利用節(jié)點(diǎn)層次關(guān)系獲取元素，簡便）

node.parentNode; // 得到當(dāng)前節(jié)點(diǎn)最近的父級節(jié)點(diǎn)，無時(shí)為null

parentNode.childNodes; // 返回所有類型子節(jié)點(diǎn)
parentNode.firstChild; // 返回第一個(gè)任意類型的子節(jié)點(diǎn)
parentNode.lastChild; // 返回最后一個(gè)任意類型的子節(jié)點(diǎn)

parentNode.children; // 返回元素類型子節(jié)點(diǎn)（常用）
parent.firstElementChild; // 返回第一個(gè)元素類型子節(jié)點(diǎn)，IE9兼容，一般通過children[0]獲取
parent.lastElementChild; // 返回最后一個(gè)元素類型子節(jié)點(diǎn)，IE9兼容，一般通過children[length-1]獲取

node.nextSibling; // 返回下一個(gè)任意類型的兄弟節(jié)點(diǎn)
node.previousSibling; // 返回上一個(gè)任意類型的兄弟節(jié)點(diǎn)

node.nextElementSibling; // 返回下一個(gè)元素類型的兄弟節(jié)點(diǎn)，IE9兼容
node.previousElementSibling; // 返回上一個(gè)元素類型的兄弟節(jié)點(diǎn)，IE9兼容

document.createElement('標(biāo)簽名'); // 創(chuàng)建元素節(jié)點(diǎn)
node.appendChild(child); // 插入元素節(jié)點(diǎn)到父級元素末尾，node父級，child子集
node.insertBefore(child, 指定元素); // 插入元素節(jié)點(diǎn)到指定元素前 
node.removeChild(child); // 刪除子節(jié)點(diǎn)
node.remove(); // 直接刪除指定元素
node.cloneNode(); // 克隆節(jié)點(diǎn)，參數(shù)為空或false只復(fù)制標(biāo)簽，參數(shù)為true復(fù)制標(biāo)簽及內(nèi)容
node.insertAdjacentHTML('位置', str); // 將文本解析為HTML并插入指定位置，比innerHTML操作更快

1.頁面中的所有內(nèi)容都是節(jié)點(diǎn)（node），節(jié)點(diǎn)至少擁有nodeType（類型）、nodeName（名稱）、nodeValue（值）三個(gè)基本屬性。
PS：阻止a鏈接跳轉(zhuǎn)：href="javascript:;"
2.三種創(chuàng)建元素方式區(qū)別：

document.write(); // 直接將內(nèi)容寫入頁面的內(nèi)容流，如果頁面文檔流加載完畢，再調(diào)這句話會導(dǎo)致頁面重繪
innerHTML; // 將內(nèi)容寫入某個(gè)DOM節(jié)點(diǎn)，不會導(dǎo)致頁面重繪；創(chuàng)建多個(gè)元素效率更高（不要拼接字符串，采取數(shù)組形式拼接），結(jié)構(gòu)稍微復(fù)雜
createElement(); // 創(chuàng)建多個(gè)元素效率稍低一點(diǎn)點(diǎn)，但是結(jié)構(gòu)清晰