南昌莫非:NamedNodeMap對(duì)象getNamedltem()、removeNamedltem()、setNamedltem()、item()方法使用方法
前面我們通過(guò)《結(jié)合實(shí)例講解getAttribute()、setAttribute()和removeAttribute()區(qū)別及使用方法》文章介紹過(guò)DOM中對(duì)元素特性操作的三個(gè)方法getAttribute()、setAttribute()和removeAttribute的使用方法，對(duì)于真正做開(kāi)發(fā)的技術(shù)人員來(lái)講，也是我們經(jīng)常要用到的，接下來(lái)由南昌網(wǎng)站制作公司莫非網(wǎng)絡(luò)開(kāi)發(fā)工程師結(jié)合實(shí)例介紹NamedNodeMap對(duì)象擁有的方法如何使用，Element類(lèi)型是使用attributes屬性的**一個(gè)DOM節(jié)點(diǎn)類(lèi)型。attributes屬性中包含一個(gè)NamedNodeMap，與NodeList類(lèi)似，也是一個(gè)“動(dòng)態(tài)"的集合。元素的每一個(gè)特性都由一個(gè)Attr節(jié)點(diǎn)表示，每個(gè)節(jié)點(diǎn)都保存在NamedNodeMap對(duì)象中。NamedNodeMap對(duì)象擁有下列方法。
getNamedltem (name)：返回nodeName屬性等于name的節(jié)點(diǎn);
◎removeNamedltem (name)：從列表中移除nodeName屬性等于name的節(jié)點(diǎn);
◎setNamedltem (node)：向列表中添加節(jié)點(diǎn)，以節(jié)點(diǎn)的nodeName屬性為索引;
◎item (pos)：返回位于數(shù)字pos位置處的節(jié)點(diǎn)。
attributes屬性中包含一系列節(jié)點(diǎn)，每個(gè)節(jié)點(diǎn)的nodeName就是特性的名稱，而節(jié)點(diǎn)的nodeValue 就是特性的值。要取得元素的id特性，可以使用以下代碼：
var id=element.attributes.getNamedltem("id").nodeValue;
以下是使用方括號(hào)語(yǔ)法通過(guò)特性名稱訪問(wèn)節(jié)點(diǎn)的簡(jiǎn)寫(xiě)方式：
var id=element.attributes["id"].nodeValue;
也可以使用這種語(yǔ)法來(lái)設(shè)置特性的值，即先取得特性節(jié)點(diǎn)，然后再將其nodeValue設(shè)置為新值， 如下所示：
element.attributes["id"].nodeValue= "someOtherld";
調(diào)用removeNamedltem()方法與在元素上調(diào)用removeAttribute()方法的效果相同——直接刪除具有給定名稱的特性。下面的例子展示了兩個(gè)方法間**的區(qū)別，即removeNamedltem()返回表
示被刪除特性的Attr節(jié)點(diǎn)：
var oldAttr=element.attributes.removeNamedltem(“id");
最后，setNamedltem()是一個(gè)很不常用的方法，通過(guò)這個(gè)方法可以為元素添加一個(gè)新特性，為此需要為它傳人一個(gè)特性節(jié)點(diǎn)，如下所示：
element. attributes.setNamedlt em (newAttr);
一般來(lái)說(shuō)，由于前面介紹的attributes的方法不夠方便，因此開(kāi)發(fā)人員更多的會(huì)使用 getAttribute()、 removeAttribute()和setAttribute()方法。
不過(guò)，如果想要遍歷元素的特性，attributes屬性倒是可以派上用場(chǎng)。在需要將DOM結(jié)構(gòu)序 列化為XML或HTML字符串時(shí)，多數(shù)都會(huì)涉及遍歷元素特性。以下代碼展示了如何迭代元素的每一
個(gè)特性，然后將它們構(gòu)造成name="value" name="value"這樣的字符串格式：
function outputAttributes( element){
var pairs=new Array();
for (var i=0, len=element .attributes. length; i var attrName=element.attributes[i].nodeName ;
var attrValue=element. attributes[i].nodeValue;
pairs. push (attrName+"=""+attrValue+""");
}
return pairs.join("");
這個(gè)函數(shù)使用了一個(gè)數(shù)組來(lái)保存名值對(duì)，最后再以空格為分隔符將它們拼接起來(lái)(這是序列化長(zhǎng) 字符串時(shí)的一種常用技巧)。通過(guò)attributes.length屬性，for循環(huán)會(huì)遍歷每個(gè)特性，將特性的名
稱和值輸出為字符串。關(guān)于以上代碼的運(yùn)行結(jié)果，以下是兩點(diǎn)必要的說(shuō)明。
◎針對(duì)attributes對(duì)象中的特性，不同瀏覽器返回的順序不同。這些特性在XML或HTML代碼中出現(xiàn)的先后順序，不一定與它們出現(xiàn)在attributes對(duì)象中的順序一致。
◎IE7及更早的版本會(huì)返回HTML元素中所有可能的特性，包括沒(méi)有指定的特性。換句話說(shuō)，返 回100多個(gè)特性的情況會(huì)很常見(jiàn)。
針對(duì)IE7及更早版本中存在的問(wèn)題，可以對(duì)上面的函數(shù)加以改進(jìn)，讓它只返回指定的特性。每個(gè)特性節(jié)點(diǎn)都有一個(gè)名為specified的屬性，這個(gè)屬性的值如果為true，則意味著要么是在HTML中
指定了相應(yīng)特性，要么是通過(guò)setAttribute()方法設(shè)置了該特性。在IE中，所有未設(shè)置過(guò)的特性的該屬性值都為false，而在其他瀏覽器中根本不會(huì)為這類(lèi)特性生成對(duì)應(yīng)的特性節(jié)點(diǎn)(因此，在這些瀏
覽器中，任何特性節(jié)點(diǎn)的specified值始終為true)，改進(jìn)后的代碼如下所示：
function outputAttributes(element){
var pairs=new Array();
for(var i=0, len=element.attributes.length;i var attrName=element.attributes[i].nodeName;
var attrValue=element.attributes[i].nodeValue;
}
return pairs.join("");
}
這個(gè)經(jīng)過(guò)改進(jìn)的函數(shù)可以確保即使在IE7及更早的版本中，也會(huì)只返回指定的特性。
本文**內(nèi)部技術(shù)人員學(xué)習(xí)交流,不得作于其他商業(yè)用途.希望此文對(duì)廣技人員有所幫助。
