Java教程

JavaScript基础学习-DOM2+DOM3

本文主要是介绍JavaScript基础学习-DOM2+DOM3，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

XML命名空间

当文档中包含两个或者两个以上命名空间时，需要制定命名空间。DOM2，DOM3新增了一些关于命名空间的特性。

1.Node变化

在DOM2 中，Node 类型包含以下特定于命名空间的属性：

  • localName，不包含命名空间前缀的节点名；
  • namespaceURI，节点的命名空间URL，如果未指定则为null；
  • prefix，命名空间前缀，如果未指定则为null。
    在节点使用命名空间前缀的情况下，nodeName 等于prefix + ":" + localName。比如下面这个
    例子：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Example XHTML page</title>
</head>
<body>
<s:svg xmlns:s="http://www.w3.org/2000/svg" version="1.1"
viewBox="0 0 100 100" style="width:100%; height:100%">
<s:rect x="0" y="0" width="100" height="100" style="fill:red" />
</s:svg>
</body>
</html>

对于元素的localName 和tagName 都是"html"，namespaceURL 是"http://www.w3.org/1999/xhtml"，而prefix 是null。
对于<s:svg>元素，localName 是"svg"，tagName 是"s:svg"，namespaceURI 是"https://www.w3.org/2000/svg"，而prefix 是"s"。

2.Document 的变化

DOM2 在Document 类型上新增了如下命名空间特定的方法：

  • createElementNS(namespaceURI, tagName)，以给定的标签名tagName 创建指定命名空间namespaceURI 的一个新元素；
  • createAttributeNS(namespaceURI, attributeName)，以给定的属性名attributeName创建指定命名空间namespaceURI 的一个新属性；
  • getElementsByTagNameNS(namespaceURI, tagName)，返回指定命名空间namespaceURI中所有标签名为tagName 的元素的NodeList。
// 创建一个新SVG 元素
let svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
// 创建一个任意命名空间的新属性
let att = document.createAttributeNS("http://www.somewhere.com", "random");
// 获取所有XHTML 元素
let elems = document.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "*");

3.Element 的变化

DOM2 Core 对Element 类型的更新主要集中在对属性的操作上。下面是新增的方法：

  • getAttributeNS(namespaceURI, localName)，取得指定命名空间namespaceURI 中名为localName 的属性；
  • getAttributeNodeNS(namespaceURI, localName)，取得指定命名空间namespaceURI 中名为localName 的属性节点；
  • getElementsByTagNameNS(namespaceURI, tagName)，取得指定命名空间namespaceURI中标签名为tagName 的元素的NodeList；
  • hasAttributeNS(namespaceURI, localName)，返回布尔值，表示元素中是否有命名空间namespaceURI 下名为localName 的属性（注意，DOM2 Core 也添加不带命名空间的hasAttribute()方法）；
  • removeAttributeNS(namespaceURI, localName)，删除指定命名空间namespaceURI 中名为localName 的属性；
  • setAttributeNS(namespaceURI, qualifiedName, value)，设置指定命名空间namespaceURI中名为qualifiedName 的属性为value；
  • setAttributeNodeNS(attNode)，为元素设置（添加）包含命名空间信息的属性节点attNode。
这篇关于JavaScript基础学习-DOM2+DOM3的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！
您可能喜欢
栏目导航