Author：Mr.柳上原
- 付出不亞于任何的努力
- 愿我們所有的努力，都不會(huì)被生活辜負(fù)
- 不忘初心捅位，方得始終
不常用的東西很快就找不到了
不常寫的方法很快就忘記了
字符串和數(shù)組的方法
大家還記的幾個(gè)
<!DOCTYPE html> <!-- 文檔類型：標(biāo)準(zhǔn)html文檔 -->
<html lang='en'> <!-- html根標(biāo)簽 翻譯文字：英文 -->
<head> <!-- 網(wǎng)頁頭部 -->
<meta charset='UTF-8'/> <!-- 網(wǎng)頁字符編碼 -->
<meta name='Keywords' content='關(guān)鍵詞1,關(guān)鍵詞2'/>
<meta name='Description' content='網(wǎng)站說明'/>
<meta name='Author' content='作者'/>
<title>前端59期學(xué)員作業(yè)</title> <!-- 網(wǎng)頁標(biāo)題 -->
<link rel='stylesheet' type='text/css' href='css/css1.css'/> <!-- 外鏈樣式表 -->
<style type='text/css'> /*內(nèi)部樣式表*/
</style>
</head>
<body> <!-- 網(wǎng)頁主干：可視化區(qū)域 -->
<div id="box">
<div id="b1"> // 屬性節(jié)點(diǎn)
content // 文本節(jié)點(diǎn)
<!-- 注釋 --> // 注釋節(jié)點(diǎn)
</div>
<p></p>
</div>
<script>
/*
DOM：
Document Object Model
*/
const box = document.getElementById("box");
// childNodes兼容性：在低版本IE下只返回元素節(jié)點(diǎn)
console.log(box.childNodes); // box的所有子節(jié)點(diǎn)（包括注釋糕韧，文本）
// children 返回元素節(jié)點(diǎn)
console.log(box.children); // box的所有子元素節(jié)點(diǎn)
// nodeType 返回節(jié)點(diǎn)類型：元素節(jié)點(diǎn)type值為1，文本節(jié)點(diǎn)type值為3
// nodeName 返回節(jié)點(diǎn)名字（大寫）
console.log(box.children[0].nodeName.toLowerCase() === "div"); // box的第一個(gè)元素節(jié)點(diǎn)的名字
// tagName 返回元素節(jié)點(diǎn)名字（大寫）
// getAttributeNode 返回元素的屬性節(jié)點(diǎn)
console.log(box.getAttributeNode("id")); // box的id屬性節(jié)點(diǎn)
// setAttributeNode 設(shè)置元素的屬性節(jié)點(diǎn)
const cls = document.createAttribute("class"); // 創(chuàng)建class屬性
box.setAttributeNode(cls); // 給box增加class屬性
console.log(box);
// setAttribute 給元素設(shè)置屬性
box.setAttribute("fengyu", "123");
console.log(box);
// getAttribute 獲取元素屬性的值
console.log(box.getAttribute("fengyu")); // box元素中fengyu屬性的值
// removeAttribute 刪除元素的屬性
console.log(box.removeAttribute("fengyu")); // 刪除box元素中的fengyu屬性
// firstChild 等價(jià)于childNode[0]
// firstElementChild 返回第一個(gè)元素節(jié)點(diǎn)，只兼容主流瀏覽器
// lastChild 跟firstChild類似页滚，返回最后一個(gè)元素節(jié)點(diǎn)
// lastElementChild 返回最后一個(gè)元素節(jié)點(diǎn)
// nextSibling 返回下一個(gè)兄弟節(jié)點(diǎn)
// nextElementSibling 返回下一個(gè)兄弟元素節(jié)點(diǎn)
// previousSibling 返回前一個(gè)兄弟節(jié)點(diǎn)
// previousElementSibling 返回前一個(gè)兄弟元素節(jié)點(diǎn)
// parentNode 返回父節(jié)點(diǎn)
// offsetParent 返回定位父級
// childElementCount 返回子元素節(jié)點(diǎn)個(gè)數(shù)
// 創(chuàng)建節(jié)點(diǎn)
document.createElement(" ");
box.appendChild(" ");
// removeChild 刪除節(jié)點(diǎn)（只能刪除子級）
// 創(chuàng)建節(jié)點(diǎn)片段（倉庫）
const a = document.createDocumentFragment( );
box.appendChild(" ");
box.appendChild(" ");
box.appendChild(a); // 一次渲染多個(gè)對象
</script>
</body>
</html>
