1. 表格的創(chuàng)建

2. DOM節(jié)點(diǎn)的遍歷:

? ? ? (父找子):

? ? ? ? ?firstElementChild 返回節(jié)點(diǎn)的第一個(gè)子節(jié)點(diǎn)，

? ? ? ? ?lastElementChild 返回節(jié)點(diǎn)的最后一個(gè)子節(jié)點(diǎn)

? ? ? ? ?childNodes:返回父節(jié)點(diǎn)的所有子節(jié)點(diǎn),返回的文本節(jié)點(diǎn)和元素節(jié)點(diǎn)

? ? ? ? ?children:返回父節(jié)點(diǎn)的所有子節(jié)點(diǎn),返回元素節(jié)點(diǎn)

? ? ? (子找父):

? ? ? ? ?parentNode

? ? ? (兄弟):

? ? ? ? ?nextElementSibling 下一個(gè)節(jié)點(diǎn)

? ? ? ? ?previousElementSibling 上一個(gè)節(jié)點(diǎn)

3. ?各種文本:

? ? js中使用的文本分為兩類:

? ? ? a.表單元素的value

? ? ? b.innerHTML (不包含自身標(biāo)簽的所有內(nèi)容) //讀文本內(nèi)容

? ? ? ? 作用:常用于字符串拼接頁(yè)面

? ? ? ? var oUl = document.querySelector("ul");

? ? ? ? for(var i=0; i<10; i++){

? ? ? ? oUl.innerHTML += "<li>"+i+"</li>";

? ? }

除此之外:outerHTML:包含自身標(biāo)簽的所有內(nèi)容

? ? ? ? innerText:只打印文本內(nèi)容,不包含標(biāo)簽

4. ?dom節(jié)點(diǎn)操作的就是屬性,圍繞各種屬性的讀寫(xiě)去學(xué)習(xí).

? ? 屬性大致分為:

? ? a.普通屬性

? ? ? 方法1:.運(yùn)算

? ? ? ? ?讀: ?

? ? ? ? ? ? ?var oBox = document.querySelector("#boxxxx");

? ? ? ? ? ? ?console.log(oBox.id);

? ? ? ? 寫(xiě): ?oBox.id = "hahaha";

? ? ? 方法2:getAttribute/setAttribute方法

? ? ? ? 讀: dom對(duì)象.getAttribute(屬性名)

? ? ? ? 寫(xiě):dom對(duì)象.setAttribute方法(屬性名,屬性值)

? ? ? ?添加自定義屬性:

? ? ? ? ? ?var oBox = document.querySelector("#boxxxx");

? ? ? ? ? ?oBox.aaaa = 99999;

? ? ? ? ? ?console.log(oBox.aaaa);

? ? ? ? b.style屬性

? ? ? ? ? 讀:getComputedStyle(dom節(jié)點(diǎn),false)["屬性名"]:返回屬性值

? ? ? ? ? ?console.log(getComputedStyle(oBox,false)["fontSize"]);

? ? ? ? ? 寫(xiě):dom節(jié)點(diǎn).style.屬性名="屬性值"

? ? ? ?注意 屬性值全是字符串

? ? ? ?eg:oBox.style.height=200+"px";

? ? ? ? c.offset相關(guān)屬性

? ? ? ? c.offset相關(guān)屬性

? ? ? ? ? ?寫(xiě):dom節(jié)點(diǎn).style.屬性名="屬性值"

? ? ? ?注意 屬性值全是字符串

? ? ? ? ? ?

? ? ? ? ? ? 讀:offset讀出來(lái)的都是數(shù)字

? ? ? ? ? ? ? 用上述style屬性方式的讀 讀出來(lái)的是帶px的字符串,但實(shí)則要的是數(shù)字

? ? ? ? ? ? dom節(jié)點(diǎn).offsetWidth

? ? ? ? ? ? dom節(jié)點(diǎn).offsetHeight

? ? ? ? ? ? dom節(jié)點(diǎn).offsetLeft

? ? ? ? ? ? dom節(jié)點(diǎn).offsetTop