DOM NamedNodeMap 学习笔记
简介
NamedNodeMap 是一个用于管理节点集合的接口,它类似于 JavaScript 中的对象或 Map。NamedNodeMap 通常用于表示元素节点的属性集合,其中每个属性都是一个 Attr 对象。NamedNodeMap 可以通过索引或名称访问属性节点。
方法
getNamedItem(name)
返回具有指定名称的属性节点。
setNamedItem(attr)
添加一个属性节点,并将其替换具有相同名称的任何现有属性节点。
removeNamedItem(name)
删除指定名称的属性节点。
示例
htmlCopy Code<!DOCTYPE html>
<html>
<body>
<p id="demo">DOM NamedNodeMap示例</p>
<script>
// 使用 document.getElementById() 方法获取id为demo的元素
var element = document.getElementById("demo");
// 使用 attributes 属性获取 NamedNodeMap
var attrs = element.attributes;
// 添加属性节点
var attr = document.createAttribute("class");
attr.value = "test";
attrs.setNamedItem(attr);
// 获取特定名称的属性节点
console.log(attrs.getNamedItem("id"));
// 删除指定名称的属性节点
attrs.removeNamedItem("class");
// 输出剩余属性节点数目
console.log(attrs.length);
</script>
</body>
</html>
在这个示例中,我们首先使用 document.getElementById()
方法获取具有 id
为 demo
的元素节点。然后,我们使用 attributes
属性获取元素节点的属性集合。
在这个示例中,我们创建了一个名为 class
的新属性节点,并将其添加到 attrs
NamedNodeMap 中。我们还使用 getNamedItem()
方法获取具有名称 id
的属性节点,并使用 removeNamedItem()
方法删除具有名称 class
的属性节点。
最后,我们输出剩余的属性节点数量。