首页 > 其他分享 >js DOM2 和 DOM3

js DOM2 和 DOM3

时间:2024-02-06 23:02:16浏览次数:28  
标签:XML DOM js 空间 文档 命名 DOM2 DOM3 XHTML

DOM2(DOM Level 2)和 DOM3(DOM Level 3)在这些结构之上加入更多交互能力,提供了更高级的 XML 特性。实际上,DOM2 和 DOM3 是按照模块化的思路来制定标准的,每个模块之间有一定关联,但分别针对某个 DOM 子集。 这些模式如下所示。  DOM Core:在 DOM1 核心部分的基础上,为节点增加方法和属性。  DOM Views:定义基于样式信息的不同视图。  DOM Events:定义通过事件实现 DOM 文档交互。  DOM Style:定义以编程方式访问和修改 CSS 样式的接口。  DOM Traversal and Range:新增遍历 DOM 文档及选择文档内容的接口。  DOM HTML:在 DOM1 HTML 部分的基础上,增加属性、方法和新接口。  DOM Mutation Observers:定义基于 DOM 变化触发回调的接口。这个模块是 DOM4 级模块,用于取代 Mutation Events。 DOM 的演进 DOM2 和 DOM3 Core 模块的目标是扩展 DOM API,满足 XML 的所有需求并提供更好的错误处理和特性检测。很大程度上,这意味着支持 XML 命名空间的概念。DOM2 Core 没有新增任何类型,仅仅在 DOM1 Core 基础上增加了一些方法和属性。DOM3 Core 则除了增强原有类型,也新增了一些新类型。 类似地,DOM View 和 HTML 模块也丰富了 DOM 接口,定义了新的属性和方法。这两个模块很小,因此本章将在讨论 JavaScript 对象的基本变化时将它们与 Core 模块放在一起讨论。 XML 命名空间 XML 命名空间可以实现在一个格式规范的文档中混用不同的 XML 语言,而不必担心元素命名冲突。严格来讲,XML 命名空间在 XHTML 中才支持,HTML 并不支持。因此,本节的示例使用 XHTML。 命名空间是使用 xmlns 指定的。XHTML 的命名空间是"http://www.w3.org/1999/xhtml",应该包含在任何格式规范的 XHTML 页面的元素中,如下所示:

<head> 
 <title>Example XHTML page</title> 
 </head> 
 <body> 
 Hello world! 
 </body> 
</html>

对这个例子来说,所有元素都默认属于 XHTML 命名空间。可以使用 xmlns 给命名空间创建一个前缀,格式为“xmlns: 前缀”,如下面的例子所示:

<xhtml:head> 
 <xhtml:title>Example XHTML page</xhtml:title> 
 </xhtml:head> 
 <xhtml:body> 
 Hello world! 
 </xhtml:body> 
</xhtml:html>

这里为 XHTML 命名空间定义了一个前缀 xhtml,同时所有 XHTML 元素都必须加上这个前缀。为避免混淆,属性也可以加上命名空间前缀,比如:

<xhtml:head> 
 <xhtml:title>Example XHTML page</xhtml:title> 
 </xhtml:head> 
 <xhtml:body xhtml:class="home"> 
 Hello world! 
 </xhtml:body> 
</xhtml:html>

这里的 class 属性被加上了 xhtml 前缀。如果文档中只使用一种 XML 语言,那么命名空间前缀其实是多余的,只有一个文档混合使用多种 XML 语言时才有必要。比如下面这个文档就使用了 XHTML 和 SVG 两种语言:

<head> 
 <title>Example XHTML page</title> 
 </head> 
 <body> 
 <svg xmlns="http://www.w3.org/2000/svg" version="1.1"
 viewBox="0 0 100 100" style="width:100%; height:100%"> 
 <rect x="0" y="0" width="100" height="100" style="fill:red" /> 
 </svg> 
 </body> 
</html>

在这个例子中,通过给元素设置自己的命名空间,将其标识为当前文档的外来元素。这样一来,元素及其属性,包括它的所有后代都会被认为属于"https://www.w3.org/2000/svg"命 名空间。虽然这个文档从技术角度讲是 XHTML 文档,但由于使用了命名空间,其中包含的 SVG 代码也是有效的。 对于这样的文档,如果调用某个方法与节点交互,就会出现一个问题。比如,创建了一个新元素,那这个元素属于哪个命名空间?查询特定标签名时,结果中应该包含哪个命名空间下的元素?DOM2 Core 为解决这些问题,给大部分 DOM1 方法提供了特定于命名空间的版本。

标签:XML,DOM,js,空间,文档,命名,DOM2,DOM3,XHTML
From: https://blog.51cto.com/u_16255561/9632414

相关文章

  • js 插入标记
    HTML5将IE发明的innerHTML和outerHTML纳入了标准,但还有两个属性没有入选。这两个剩下的属性是innerText和outerText。innerText属性innerText属性对应元素中包含的所有文本内容,无论文本在子树中哪个层级。在用于读取值时,innerText会按照深度优先的顺序将子树中所有文......
  • js scrollIntoView()
    DOM规范中没有涉及的一个问题是如何滚动页面中的某个区域。为填充这方面的缺失,不同浏览器实现了不同的控制滚动的方式。在所有这些专有方法中,HTML5选择了标准化scrollIntoView()。scrollIntoView()方法存在于所有HTML元素上,可以滚动浏览器窗口或容器元素以便包含元素进入视口......
  • js 字符集属性
    HTML5增加了几个与文档字符集有关的新属性。其中,characterSet属性表示文档实际使用的字符集,也可以用来指定新字符集。这个属性的默认值是"UTF-16",但可以通过元素或响应头,以及新增的characterSeet属性来修改。下面是一个例子:document.characterSet="UTF-8";自定义数据属性HTM......
  • js 焦点管理
    HTML5增加了辅助DOM焦点管理的功能。首先是document.activeElement,始终包含当前拥有焦点的DOM元素。页面加载时,可以通过用户输入(按Tab键或代码中使用focus()方法)让某个元素自动获得焦点。例如:```letbutton=document.getElementById("myButton");button.focus();conso......
  • 【nw.js】使用nw.js将html页面打包成exe免安装程序
    @[TOC]一、批处理zip命令(已有可跳过此步骤)下载zip,你可以到该网址下载zip执行文件,如下图:将文件路径配置到环境变量中,具体操作如下:右键计算机——>属性——>高级系统设置——>高级——>环境变量——>系统变量——>找到path,双击——>新建——>将所在路径添加进去(如:“F:\zip”包含进环......
  • spring boot controller设置返回json
    在SpringBoot中,Controller通常会返回JSON格式的数据,这得益于SpringBoot的自动配置能力以及内嵌的Jackson库。以下是如何设置Controller返回JSON数据的基本步骤:添加依赖:首先,确保你的项目中包含了SpringBoot的WebStarter依赖,它已经包括了Jackson库,用于处理JSON序列化。<dependen......
  • app.json 中未定义自定义编译中指定的启动页面
    换了启动页,这里得手动改。。。。。。。。。。。[app.json或自定义编译条件错误]app.json中未定义自定义编译中指定的启动页面./pages/index/index(env:Windows),......
  • nodejs学习计划--(三)http协议和IP介绍
    一、HTPP协议1、概念HTTP(hypertexttransportprotocol)协议;中文叫超文本传输协议是一种基于TCP/IP的应用层通信协议这个协议详细规定了浏览器和万维网服务器之间互相通信的规则。协议中主要规定了两个方面的内容客户端:用来向服务器发送数据,可以被称之为请求报文服务端......
  • js相关知识
    toFixed(num)只保留小数点后几位例如:console.log(0.1+0.2)   //0.300000000000004console.log((0.1+0.2).toFixed(1));   //输出值为0.3 === 比较运算符,要求数值和数值类型都要相等,返回truedocument.writeln(数据) 能将数据输出到页面上 遍历数组的两种方......
  • nginx改变访问应用端口以及解决css,js或表单提交访问不到的问题
    场景如果原先某个网站是通过ip:8080直接访问的,现在想要加个前缀,并且去掉端口进行访问,比如ip/myapp去访问这个项目,可以通过nginx来实现这个过程。最近有个需求需要变更redmine的访问路径,从ip:8080改成ip/redmine,下面以redmine举例子。配置过程以ip/redmine来访问原先ip:8080的项......