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() 方法获取具有 iddemo 的元素节点。然后,我们使用 attributes 属性获取元素节点的属性集合。

在这个示例中,我们创建了一个名为 class 的新属性节点,并将其添加到 attrs NamedNodeMap 中。我们还使用 getNamedItem() 方法获取具有名称 id 的属性节点,并使用 removeNamedItem() 方法删除具有名称 class 的属性节点。

最后,我们输出剩余的属性节点数量。