資訊專欄INFORMATION COLUMN
摘要：對象的標(biāo)準(zhǔn)規(guī)范中提供了對象，該對象主要提供了用于解析節(jié)點(diǎn)樹結(jié)構(gòu)的屬性和方法，樹結(jié)構(gòu)主要是依靠節(jié)點(diǎn)進(jìn)行解析，成為節(jié)點(diǎn)樹結(jié)構(gòu)，對象是解析節(jié)點(diǎn)樹結(jié)構(gòu)的主要入口，對象提供的屬性和方法，可以實(shí)現(xiàn)遍歷節(jié)點(diǎn)插入節(jié)點(diǎn)等操作判斷節(jié)點(diǎn)類型元素名得到標(biāo)簽名稱大
Node對象
Dom的標(biāo)準(zhǔn)規(guī)范中提供了Node對象，該對象主要提供了用于解析DOM節(jié)點(diǎn)樹結(jié)構(gòu)的屬性和方法，DOM樹結(jié)構(gòu)主要是依靠節(jié)點(diǎn)進(jìn)行解析，成為DOM節(jié)點(diǎn)樹結(jié)構(gòu)，Node對象是解析DOM節(jié)點(diǎn)樹結(jié)構(gòu)的主要入口，Node對象提供的屬性和方法，可以實(shí)現(xiàn)遍歷節(jié)點(diǎn)、插入節(jié)點(diǎn)等操作
判斷節(jié)點(diǎn)類型
元素名.nodeName; - 得到標(biāo)簽名稱(大寫)
元素名.nodeType; - 得到元素的類型
元素名.nodeValue; - 得到元素的文本內(nèi)容
獲取父節(jié)點(diǎn)
節(jié)點(diǎn)名.parentNode; - 獲取子節(jié)點(diǎn)的父節(jié)點(diǎn)
節(jié)點(diǎn)名.parentElement; - 獲取其父元素節(jié)點(diǎn)
獲取子節(jié)點(diǎn)
節(jié)點(diǎn)名.childNodes; - 獲取父節(jié)點(diǎn)下的所有子節(jié)點(diǎn)
節(jié)點(diǎn)名.firstChild; - 獲取父節(jié)點(diǎn)下第一個(gè)子節(jié)點(diǎn)
節(jié)點(diǎn)名.lastChild; - 獲取父節(jié)點(diǎn)下最后一個(gè)子節(jié)點(diǎn)
獲取相鄰兄弟節(jié)點(diǎn)
節(jié)點(diǎn)名.previousSibling; - 獲取上一個(gè)兄弟元素
節(jié)點(diǎn)名.nextSibling; - 獲取下一個(gè)兄弟元素
appendChild()方法
父節(jié)點(diǎn).appendChild(子節(jié)點(diǎn)); - 向父節(jié)點(diǎn)添加子節(jié)點(diǎn)，默認(rèn)從最后面添加
父節(jié)點(diǎn).insertBefore(新創(chuàng)建的節(jié)點(diǎn),頁面中的舊節(jié)點(diǎn)); - 向父元素中的指定子節(jié)點(diǎn)在其前面添加
刪除節(jié)點(diǎn)
父節(jié)點(diǎn).removeChild(子節(jié)點(diǎn)); - 刪除指定的子節(jié)點(diǎn)
替換節(jié)點(diǎn)
父節(jié)點(diǎn).replaceChild(新的子節(jié)點(diǎn),目標(biāo)節(jié)點(diǎn)); - 可以替換掉父節(jié)點(diǎn)中被選中的目標(biāo)子節(jié)點(diǎn)
復(fù)制節(jié)點(diǎn)
被復(fù)制的目標(biāo)節(jié)點(diǎn).cloneNode(true); - true為深度克隆，會將節(jié)點(diǎn)的所有東西克隆過去，false為非深度克隆，不會克隆文本，默認(rèn)為false
textContent屬性
節(jié)點(diǎn).textContent; - 輸出節(jié)點(diǎn)里面的文本內(nèi)容
Element對象DOM的標(biāo)準(zhǔn)規(guī)范中提供了Element對象，該對象提供了HTML頁面中所有元素所具有的屬性和方法，DOM標(biāo)準(zhǔn)規(guī)范中提供了Node對象，主要是依靠DOM節(jié)點(diǎn)樹結(jié)構(gòu)訪問和更新HTML頁面的內(nèi)容。而DOM標(biāo)準(zhǔn)規(guī)范中提供了Element對象，主要是依靠DOM元素樹結(jié)構(gòu)訪問和更新HTML頁面內(nèi)容，所有的HTML頁面的元素都是HTMLElement對象，而這個(gè)對象又是繼承于Element對象的
獲取子元素
父元素.firstElementChild; - 獲取父元素中第一個(gè)子元素
父元素.lastElementChild; - 獲取父元素中最后一個(gè)子元素
獲取相鄰兄弟元素
元素.previousElementSibling; - 獲取元素的上一個(gè)兄弟元素
元素.nextElementSibling; - 獲取元素的下一個(gè)兄弟元素
屬性操作
元素.getAttribute("屬性名稱"); - 獲取指定元素的指定屬性
元素.setAttribute("屬性名稱","屬性值") - 設(shè)置指定元素的屬性名稱以及屬性值
元素.removeAttribute("屬性名稱"); - 刪除指定元素的屬性
元素.hasAttribute("屬性名稱"); - 判斷指定元素指定屬性是否存在，結(jié)果返回布爾值
innerHTML屬性
元素.innerHTML; - 獲取指定元素的HTML代碼
父元素.innerHTML=HTML代碼; - 給父元素添加HTML代碼，直接把html代碼寫在字符串中，但是這個(gè)方法具有安全問題
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/97215.html
摘要：唯一要注意的是返回的雖然是，但是實(shí)際上是元素集合，并且是靜態(tài)的其他接口返回的和都是的。與相同的是它也是一個(gè)動態(tài)的集合，與不同的是，中保存的是一組無序的屬性節(jié)點(diǎn)的集合。及以下版本瀏覽器中，注釋屬于算作因此會出現(xiàn)在里。而且是元素的集合。 NodeList v.s. HTMLCollection 主要有兩個(gè)方面不一樣1.包含節(jié)點(diǎn)的類型2.使用方法 1.包含節(jié)點(diǎn)的類型不同(重要) (1)Nod...
摘要：唯一要注意的是返回的雖然是，但是實(shí)際上是元素集合，并且是靜態(tài)的其他接口返回的和都是的。與相同的是它也是一個(gè)動態(tài)的集合，與不同的是，中保存的是一組無序的屬性節(jié)點(diǎn)的集合。及以下版本瀏覽器中，注釋屬于算作因此會出現(xiàn)在里。而且是元素的集合。 NodeList v.s. HTMLCollection 主要有兩個(gè)方面不一樣1.包含節(jié)點(diǎn)的類型2.使用方法 1.包含節(jié)點(diǎn)的類型不同(重要) (1)Nod...
摘要：效果預(yù)覽來自的效果預(yù)覽引用了，已被墻，請謹(jǐn)慎預(yù)覽轉(zhuǎn)載聲明這篇文章其實(shí)源自的博客。主要內(nèi)容整個(gè)效果都建立在的里面。為了彌補(bǔ)這個(gè)缺陷，我決定改成在函數(shù)中對進(jìn)行操作。重點(diǎn)來了，是和初始位置的相對位置。就是元素的初始值。 效果預(yù)覽 來自codepen的效果預(yù)覽：（引用了angularjs，已被墻，請謹(jǐn)慎預(yù)覽）http://codepen.io/flybywind/pen/aNjxJa 轉(zhuǎn)載聲明...
摘要：效果預(yù)覽來自的效果預(yù)覽引用了，已被墻，請謹(jǐn)慎預(yù)覽轉(zhuǎn)載聲明這篇文章其實(shí)源自的博客。主要內(nèi)容整個(gè)效果都建立在的里面。為了彌補(bǔ)這個(gè)缺陷，我決定改成在函數(shù)中對進(jìn)行操作。重點(diǎn)來了，是和初始位置的相對位置。就是元素的初始值。 效果預(yù)覽 來自codepen的效果預(yù)覽：（引用了angularjs，已被墻，請謹(jǐn)慎預(yù)覽）http://codepen.io/flybywind/pen/aNjxJa 轉(zhuǎn)載聲明...
閱讀 3834·2021-08-11 11:16
閱讀 1676·2019-08-30 15:44
閱讀 2041·2019-08-29 18:45
閱讀 2331·2019-08-26 18:18
閱讀 1100·2019-08-26 13:37
閱讀 1613·2019-08-26 11:43
閱讀 2179·2019-08-26 11:34
閱讀 429·2019-08-26 10:59
