Element和Attr節點


Element節點為元素節點,對應着html頁面中具體的標簽

nodeType為1

nodeName為相應的標簽的名

nodeValue為null

Attr為特性節點,對應着每個標簽中的屬性,它是一個節點,但是不存在於DOM的節點樹當中

nodeType為11

nodeName為屬性的名稱

nodeValue為屬性具體的值


<div class="abc" id="_id" dir="ltr" title="_title"></div>

上面一段代碼定義了div的 class(在js中調用class元素時要使用className)dir(從左到右還是從右到左)title等屬性

當得到div對象后,假設對象名為div

1 可以得到

  div.className 

  div.id

  div.dir

  div.title

  可以得到這些屬性的值

  同時可以對這些屬性的值進行修改

  同時也可以添加屬性

  例如div.align="center"

  alert(div.id)

  div.id="a"

2 setAttribute():可以修改屬性的值,也可以添加屬性

   例如div.setAttribute("id","abc")

         div.setAttribute("other","kkk")//自己增加的屬性

         div.setAttribute("align",“center”)//增加div具有的屬性

   getAttribute():得到屬性的值,即可以得到系統具有的屬性的值,也可以得到自己定義的屬性的值

   div.getAttribute("id")//得到_id

   removeAttribute() 刪除屬性 

3attributes屬性

  每個元素都有attributes屬性,每個attributes屬性有

  getNamedItem()

  setNamesItem()

  removeNamedItem()

  Item()

  四個方法

  還有一個length屬性,代表屬性的個數

  getNamedItem():得到某一個屬性的節點

  div.attributes.getNamedItem("id")//返回id屬性的節點   也可以寫成div.attributes["id"]

  div.attributes.getNamedItem("id").nodeValue//得到id屬性的值,_id

  setNamedItem():為元素添加屬性

  div.attributes.getNamedItem(newAttr)//newAttr為新創建的元素,添加到了div中

  removeNamedItem():刪除屬性

  div.attributes.removeNamedItem("id")//刪除了id屬性

  item():得到某一位置的屬性

  div.attributes.item(2)//得到第三個,即dir屬性 也可以寫成div.attributes[2]

  div.attributes.length 得到屬性的個數

  attributes屬性是和NodeList一樣動態變化的,即每增加一個屬性,會馬上在attributes.length中得到反映

  每個屬性都有specified屬性,為Boolen屬性,如果為真,表明這個屬性是在元素中定義了或者用js的方法添加到元素中了

                                                             如果為假,則說明沒有這個元素

  attributes主要用於屬性的遍歷

  var arr=new Array();

  for(var i=0,var len=div.attributes.length;i<len;i++)

  { 

     if(div.attributes[i].specified)

      {

         arr.push(div.attributes[i].nodeValue);

      }

  }

Attr節點

1它有三個屬性

 name:屬性節點的名,相當於nodeName

 value:屬性節點的值,相當於nodeValue

 specified:該屬性節點是否被添加到了標簽中

 例如上面的div.attributes[i]就是一個屬性節點

 可以獲取他的name,value,specified

 它有兩個方法

 createAttribute():創建節點

 setAttributeNode();將創建的節點添加到元素中

 var ali=document.createAttribute("align")//創建了一個align屬性節點

 align="center"//為屬性節點賦值

 div.setAttributeNode(ali)//將屬性節點添加到div中

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM