html dom实例,HTML DOM setNamedItem()用法及代码示例

setNamedItem()方法用于使用名称将特定节点添加到属性节点。这些属性节点统称为namedNodeMap。可以通过名称访问。如果文档中已经存在一个节点，它将替换它并返回更新的值。 setNamedItem()方法需要一个节点作为参数。

用法:

namedNodeMap.setNamedItem( node )

参数值：此方法包含强制性的单个参数节点。此参数是需要在namedNodeMap集合中添加或替换的节点值。

范例1：

DOM setNamedItem() Method

.gfg {

color:green;

font-size:40px;

}

GeeksforGeeks

DOM setNamedItem() Method

Set Node

function setNameItem() {

// It is used to fetch the text

// present in class geeks1

var one =

document.getElementsByClassName("geeks1")[0];

// New class (geek) is created

var geek = document.createAttribute("class");

// Passing value of gfg class into geek class

geek.value = "gfg";

// Updating the CSS property of geeks1

// class to gfg class

one.attributes.setNamedItem(geek);

}

输出：

之前单击按钮：

单击按钮后：

范例2：

DOM setNamedItem() Method

.gfg {

color:green;

font-size:40px;

}

.gfg1 {

color:green;

font-size:40px;

}

GeeksforGeeks

DOM setNamedItem() Method

Welcome to GeeksforGeeks

Set Node

function setNameItem() {

var one =

document.getElementsByTagName("H1")[0];

var geek =

document.createAttribute("class");

geek.value = "gfg";

one.attributes.setNamedItem(geek);

var two =

document.getElementsByTagName("H3")[0];

var geek1 =

document.createAttribute("class");

geek1.value = "gfg1";

two.attributes.setNamedItem(geek1);

}

输出：

之前单击按钮：

单击按钮后：

支持的浏览器：下面列出了DOM setNamedItem()方法支持的浏览器：

谷歌浏览器

IE浏览器

火狐浏览器

Opera

苹果浏览器