//1,獲取指定標(biāo)簽
//通過id查找對應(yīng)的元素節(jié)點,返回一個具體的元素節(jié)點
var one= document.getElementById("one");
//通過class名查找對應(yīng)的元素節(jié)點,返回一個 包含元素節(jié)點的數(shù)組
var ones= document.getElementsByClassName("son");
//通過標(biāo)簽查找對應(yīng)的元素節(jié)點,返回一個 包含元素節(jié)點的數(shù)組
var divs? = document.getElementsByTagName("div");
//通過選擇器獲取查找元素節(jié)點 返回一個包含元素節(jié)點的數(shù)組
var divall= document.querySelectorAll(".fat .son");
//通過選擇器獲取查找元素節(jié)點 返回一個包含元素節(jié)點,只返回找到的第一個
var divsel= document.querySelector(".fat .son");
//特殊的節(jié)點
//1,document 文檔節(jié)點
console.log(document);
//2,html 節(jié)點
console.log(document.documentElement);
//3,body 節(jié)點
console.log(document.body);
//4,head 節(jié)點
console.log(document.head);
//5,聲明節(jié)點
console.log(document.doctype);
//2,創(chuàng)建新的標(biāo)簽
var imgM= document.createElement("img");
imgM.src= "img/1.jpg";
imgM.width= "300";
//3,添加標(biāo)簽
var conDiv= document.getElementById("container");
//(1)A.appendChild(B) :將B元素添加到A元素內(nèi)部的后邊 A 和 B 是父子關(guān)系
conDiv.appendChild(imgM);
//(2) A.insertBefore(B,C) 將B元素添加到 A元素中 C元素的前邊.A 和 B,C 是父子關(guān)系
var linkm= document.createElement("a");
linkm.innerText= "圖片";
linkm.innerHTML+= "拼在后邊";
var txt=document.createTextNode("最后邊");
linkm.appendChild(txt);
linkm.href= "###";
conDiv.insertBefore(linkm,imgM);
//4,替換標(biāo)簽
var pM= document.createElement("p");
pM.innerHTML= "P";
//A.replaceChild(B,C) 用B元素 替換A元素中的C 元素
conDiv.replaceChild(pM,imgM);
//5,移除標(biāo)簽
//A.removeChild(B):移除A元素中的B元素
conDiv.removeChild(linkm);
//一: 設(shè)置屬性
//第1種設(shè)置方式
// div.id = "oneDiv";
// div.className = "oneDiv";
//第2種設(shè)置方式
div.setAttribute("id","oneDiv");
div.setAttribute("class","oneDiv");
//二: 獲取屬性
//第一種獲取方式
console.log(div.id);
console.log(div.className);
//第二種獲取方式
console.log(div.getAttribute("id"));
console.log(div.getAttribute("class"));
//判斷元素是否擁有某一個屬性
var rel= div.hasAttribute("id");
if(rel){
console.log(div.getAttribute("id"));
}
//其他獲取操作
//(1)子節(jié)點
var childs= div.childNodes;
console.log(childs);
//(2)父節(jié)點
var parent= div.parentNode;
console.log(parent);
//(3)上一個兄弟節(jié)點
var sib= div.previousSibling;
console.log(sib);
//(4)下一個兄弟節(jié)點
var nextSib= div.nextSibling;
console.log(nextSib);
//(5)div 標(biāo)簽的節(jié)點名(大寫形式放回當(dāng)前元素節(jié)點名)
var name= div.nodeName;
console.log(name);
//(6)標(biāo)簽的克隆
//A.cloneNode(deep):克隆A標(biāo)簽,并返回.?
/*deep 是一個布爾值:
* ture 同時克隆A標(biāo)簽中的內(nèi)容及子元素
* false 只克隆當(dāng)前A標(biāo)簽
*?
*/
var val= div.cloneNode(true);
document.body.appendChild(val);