成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

20170609-DOM相關(guān)屬性和方法

tomorrowwu / 2450人閱讀

摘要：父子元素節(jié)點(diǎn)屬性返回子元素節(jié)點(diǎn)的個(gè)數(shù)返回當(dāng)前元素的子元素節(jié)點(diǎn)的集合返回第一個(gè)子元素節(jié)點(diǎn)返回最后一個(gè)子元素節(jié)點(diǎn)返回同級(jí)的下一個(gè)元素節(jié)點(diǎn)返回同級(jí)的前一個(gè)元素節(jié)點(diǎn)返回父元素節(jié)點(diǎn)獲取當(dāng)前元素節(jié)點(diǎn)的相關(guān)屬性返回該元素所有屬性的一個(gè)實(shí)時(shí)集合是一個(gè)對(duì)象

Element: 父子元素節(jié)點(diǎn)屬性:

childElementCount:返回子元素節(jié)點(diǎn)的個(gè)數(shù)

children:返回當(dāng)前元素的子元素節(jié)點(diǎn)的集合

firstElementChild:返回第一個(gè)子元素節(jié)點(diǎn)

lastElementChild:返回最后一個(gè)子元素節(jié)點(diǎn)

nextElementSibling:返回同級(jí)的下一個(gè)元素節(jié)點(diǎn)

previousElementSibling:返回同級(jí)的前一個(gè)元素節(jié)點(diǎn)

parentElement：返回父元素節(jié)點(diǎn)

獲取當(dāng)前元素節(jié)點(diǎn)的相關(guān)屬性

attributes:返回該元素所有屬性的一個(gè)實(shí)時(shí)集合,是一個(gè) NamedNodeMap 對(duì)象

var attrs = element.attributes;
    for(var i=attrs.length-1; i>=0; i--) {
        output+= attrs[i].name + "->" + attrs[i].value;
    }

classList:返回一個(gè)元素的類屬性的實(shí)時(shí)集合

classList.add(String[,String]):為元素添加 類

classList.remove(String[,String]):為元素移除 類

classList.item(number): 按集合中的索引返回類值

containes(String):判斷當(dāng)前元素是否存在某一個(gè) 類

className:獲取或者設(shè)置元素的class屬性的值

var class = element.className

element.className = "class01 class02 class03"

id:獲取或設(shè)置元素的id屬性的值

name:獲取或設(shè)置元素的name屬性的值,例如input元素的name值

tagName:獲取當(dāng)前元素的標(biāo)簽名

innerHTML:獲取或者設(shè)置當(dāng)前元素的內(nèi)部內(nèi)容,用此方法修改元素內(nèi)部的子節(jié)點(diǎn)

innerText:獲取或者修改當(dāng)前元素內(nèi)部的文本內(nèi)容(排除了html元素)

outerHTML: 獲取或者設(shè)置當(dāng)前元素的內(nèi)部內(nèi)容(包括該節(jié)點(diǎn))

其他的屬性

clientHeight:元素內(nèi)部高度(content+padding的高度,但不包括水平滾動(dòng)條的高度)

scrollHeight:和clientHeight相似,包括overflow樣式屬性導(dǎo)致的視圖中不可見內(nèi)容

clientWidth

scrollWidth

scrollTop: 元素垂直方向上滾動(dòng)的距離(當(dāng)一個(gè)元素的容器沒有產(chǎn)生垂直方向的滾動(dòng)條,那它的 scrollTop 的值默認(rèn)為0)

scrollLeft: 元素水平方向上的滾動(dòng)距離(當(dāng)一個(gè)元素的容器沒有產(chǎn)生水平方向的滾動(dòng)條,那它的 scrollTop 的值默認(rèn)為0.)

style: 修改當(dāng)前元素節(jié)點(diǎn)的css樣式

document.body.style.background = "green";
常用方法:

在其子元素節(jié)點(diǎn)中查找對(duì)應(yīng)的元素節(jié)點(diǎn):

getElement....():

querySelector...():

append():在其字節(jié)點(diǎn)的末尾添加新的節(jié)點(diǎn)(不一定是元素節(jié)點(diǎn)) 不推薦使用!!!

document.body.append("abcdefg"); // 插入文本節(jié)點(diǎn)

getAttribute():返回(參數(shù)中)指定的屬性值

hasAttribute():判斷是否有(參數(shù)中)指定的屬性值

removeAttribute():移除(參數(shù)中)指定的屬性

setAttribute():添加新屬性或修改原有屬性

HtmlNode.setAttribute("name","xin");

Element可以調(diào)用Node的方法和屬性,但是Node不可以調(diào)用Element的方法和屬性

Node 父子節(jié)點(diǎn)屬性

childNodes:返回所有子節(jié)點(diǎn)集合(不一定都是元素節(jié)點(diǎn))

firstChild:返回第一個(gè)子節(jié)點(diǎn)(不一定是元素節(jié)點(diǎn))

lastChild:返回最后一個(gè)子節(jié)點(diǎn)(不一定是元素節(jié)點(diǎn))

parentNode: 返回父節(jié)點(diǎn)

nextSibling:返回當(dāng)前節(jié)點(diǎn)的下一個(gè)節(jié)點(diǎn)(不一定是元素節(jié)點(diǎn))

previousSibling:返回當(dāng)前節(jié)點(diǎn)的上一個(gè)節(jié)點(diǎn)(不一定是元素節(jié)點(diǎn))

children:返回 子元素節(jié)點(diǎn) 的集合

parentElement:返回 夫元素節(jié)點(diǎn)

其他屬性

innerText:返回其節(jié)點(diǎn)和子節(jié)點(diǎn)所包含的文字

nodeName:返回節(jié)點(diǎn)名稱

nodeType:返回節(jié)點(diǎn)類型(返回節(jié)點(diǎn)名稱對(duì)應(yīng)的數(shù)字表示)

nodeValue:返回節(jié)點(diǎn)的值

方法

appendChild()

insertBefore()

removeChild(): 移除指定子節(jié)點(diǎn),并返回該子節(jié)點(diǎn)

replaceChild(newChild, oldChild):替換指定的子節(jié)點(diǎn),并返回被替換的子節(jié)點(diǎn)

cloneNode()

contains(node): 判斷傳入的節(jié)點(diǎn)是否是當(dāng)前節(jié)點(diǎn)的子節(jié)點(diǎn)

hasChildNodes():判斷當(dāng)前節(jié)點(diǎn)是否有子節(jié)點(diǎn)

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/87002.html

相關(guān)文章

  • 20170609-DOM總結(jié)

    摘要：是針對(duì)和文檔的一個(gè)。在瀏覽器中，對(duì)象是繼承自類型的一個(gè)實(shí)例，表示整個(gè)頁面。不過只有公認(rèn)的特性才會(huì)以屬性的形式添加到對(duì)象中。總結(jié)操作往往是程序中開銷最大的部分，而因訪問導(dǎo)致的問題為最多。有鑒于此，最好的辦法就是盡量減少操作。 DOM是針對(duì)HTML和XML文檔的一個(gè)API。DOM描繪了一個(gè)層次化的節(jié)點(diǎn)樹，允許開發(fā)人員添加、移除和修改頁面的某一部分。 節(jié)點(diǎn)層次 ...

    Mertens 評(píng)論0 收藏0

  • klass 是如何實(shí)現(xiàn)JS的類以及類的相關(guān)屬性和作用

    摘要：前面介紹了和是如何實(shí)現(xiàn)類，及其類的屬性和作用的。今天介紹的就是單純的實(shí)現(xiàn)面向?qū)ο蟮膸欤挥卸嘈?，也照例分析吧? 前面介紹了prototype.js和Mootools.js是如何實(shí)現(xiàn)類，及其類的屬性和作用的。今天介紹的klass.js就是單純的實(shí)現(xiàn)面向?qū)ο蟮膸欤挥?0多行，也照例分析吧。 實(shí)現(xiàn)類的步驟 第一步是使用klass新建類，初始化的固定函數(shù)是initialize，不能使用其它...

    Kross 評(píng)論0 收藏0

  • 原型（prototype）相關(guān)方法，jquery類型判斷源碼分析。

    摘要：先來看一個(gè)這樣的對(duì)象在函數(shù)的原型上擴(kuò)展了一個(gè)方法可以看到實(shí)例化的對(duì)象下有一個(gè)屬性，而這個(gè)屬性就指向構(gòu)造函數(shù)的原型對(duì)象。重點(diǎn)是，連接的是實(shí)例對(duì)象與構(gòu)造函數(shù)原型對(duì)象，而不是，實(shí)例對(duì)象和構(gòu)造函數(shù)。 前言 介紹原型的概念，和相關(guān)屬性，以及jquery判斷純凈對(duì)象的實(shí)現(xiàn)，不小心點(diǎn)進(jìn)來的直接 ctrl+f 搜你想找的屬性。 什么是原型 isPrototypeOf() || Object.getP...

    madthumb 評(píng)論0 收藏0

  • js的Set和Map相關(guān)屬性和方法

    摘要：實(shí)例的屬性和方法實(shí)例屬性構(gòu)造函數(shù)，默認(rèn)就是函數(shù)。實(shí)例方法分為兩大類操作方法用于操作數(shù)據(jù)和遍歷方法用于遍歷成員。返回一個(gè)布爾值，表示該值是否為的成員。遍歷方法結(jié)構(gòu)原生提供三個(gè)遍歷器生成函數(shù)和一個(gè)遍歷方法。返回鍵值的遍歷器。 Set 實(shí)例的屬性和方法 Set 實(shí)例屬性:Set.prototype.constructor：構(gòu)造函數(shù)，默認(rèn)就是Set函數(shù)。Set.prototype.size：返...

    pinecone 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<