DOM变化

针对XML命名空间的变化

XML命名空间

为什么要引用XML命名空间？
在 XML 中，元素名称是由开发者定义的，当两个不同的文档使用相同的元素名时，就会发生命名冲突，XML 命名空间提供避免元素命名冲突的方法。

  1. <table>
  2.   <tr>
  3.       <td>Apples</td>
  4.       <td>Bananas</td>
  5.     </tr>
  6. </table>
  8. <h:table xmlns:h="http://www.w3.org/TR/html4/">                 //使用 xmlns 属性定义 XML 命名空间
  9.     <h:tr>                                                                                                 //使用前缀来避免命名冲突            
  10.         <h:td>Apples</h:td>
  11.         <h:td>Bananas</h:td>
  12.     </h:tr>
  13. </h:table>

在 XML 中使用前缀时，必须定义一个用于前缀的命名空间。
命名空间声明语法：**xmlns:前缀="URI"**
**

Node类型

  1. <html xmlns="http://www.w3.rog/TR/html4">
  2.   <head>
  3.       <title>Example XHTML page</title>
  4.   </head>
  5.     <body>
  6.     <s:svg xmlns:s="http://www.w3.org/2000/svg" versuib="1.1"
  7.                 viewBox="0 0 100 100" style="width:100%;height:100%">
  8.       <s:rect x="0" y="0" width="100" height="100" style="fill:red"/>
  9.     </s:svg>
  10.   </body>
  11. </html>
  • Dom2

**Node.namespaceURI ** 已废弃
**Node.localName** 只读属性，返回本地名称
**Node.prefix**命名空间前缀或null

以上代码中

  • <html>元素： localName为”html”，prefix为”null”
  • <s:svg>元素：localName为”svg”，prefix为”s”
  • Dom3

Node.isDefaultNamespace接受一个命名空间URI作为参数,如果是当前节点的默认命名空间返回true
Node.lookupNamespaceURI返回当前节点上与指定命名空间前缀绑定的命名空间URI
Node.lookupPrefix返回一个和指定命名空间URI绑定的命名空间前缀

  1. document.body.isDefaultNamespace("http://www.w3.org/TR/html4")   // true
  3. svg.lookupNamespaceURI("s")        // "http://www.w3.org/2000/svg"
  4. svg.lookupPrefix("http://www.w3.org/2000/svg")        // "s"

Document类型

  • document.createElementNS 创建一个具有指定的命名空间URI和限定名称的元素 ```javascript let element = document.createElementNS(namespaceURI, qualifiedName[, options]) // 语法

var svg = document.createElementNS(“http://www.w3.org/2000/svg","svg“) // 创建一个新的 SVG 元素

  2. - `document.createAttributeNS`  给定命名空间创建一个新的属性节点并返回
  3. ```javascript
  4. var att = document.createAttributeNS("http://www.somewhere.com","random") // 创建一个属于某个命名空间的新特性
  • document.getElementsByTagNameNS 返回带有指定名称和命名空间的元素集合 ```javascript elements = document.getElementsByTagNameNS(namespace, name)

var elems = document.getElementsByTagNameNS(“http://www.w3.org/1999/xhtml","*“) // 取得所有 XHTML 元素 ```

Element类型

  • getAttributeNS(namespaceURI,localName) 取得属于命名空间 namespaceURI且名为localName的特性
  • getAttributeNodeNS(namespaceURI,localName) 取得属于命名空间 namespaceURI且名为localName的特性节点
  • getElementsByTagNameNS(namespaceURI,tagName) 返回属于命名空间namespaceURI的tagName元素的 NodeList
  • hasAttributeNS(namespaceURI,localName) 确定当前元素是否有名为localName的特性
  • removeAttributeNS(namespaceURI,localName) 删除属于命名空间namespaceURI的特性
  • setAttributeNS(namespaceURI,qualifiedName,localName) 设置属于命名空间namespaceURI且名为qualifiedName的特性
  • setAttributeNodeNS(attrNode) 设置属于命名空间namespaceURI的特性

NamedNodeMap类型

由于一般都是通过元素访问特性，所以很少使用
~~

其他方面的变化

DocumentType类型

新增3个属性：publicId、systemId、internalSubset，但是在实际生产环境中极少用到。

样式

遍历

范围