首页
学习
活动
专区
工具
TVP
发布

HTML DOM(一):认识DOM

DOM 可被 JavaScript 用来读取、改变 HTML、XHTML 以及 XML 文档。...DOM 被分为不同的部分(核心、XML及HTML)和级别(DOM Level 1/2/3):        Core DOM                定义了一套标准的针对任何结构化文档的对象 ...       XML DOM                定义了一套标准的针对 XML 文档的对象         HTML DOM                定义了一套标准的针对 HTML...节点        根据 DOMHTML 文档中的每个成分都是一个节点。        ...DOM 是这样规定的: 整个文档是一个文档节点  每个 HTML 标签是一个元素节点  包含在 HTML 元素中的文本是文本节点  每一个 HTML 属性是一个属性节点  注释属于注释节点  Node

1.5K00
您找到你想要的搜索结果了吗?
是的
没有找到

HTML DOM 方法

HTML DOM 方法是我们可以在节点(HTML 元素)上执行的动作。 HTML DOM 属性是我们可以在节点(HTML 元素)设置和修改的值。...---- 编程接口 可通过 JavaScript (以及其他编程语言)对 HTML DOM 进行访问。 所有 HTML 元素被定义为对象,而编程接口则是对象方法和对象属性。...DOM 对象 - 方法和属性 一些常用的 HTML DOM 方法: getElementById(id) - 获取带有指定 id 的节点(元素) appendChild(node) - 插入新的子节点...(元素) removeChild(node) - 删除子节点(元素) 一些常用的 HTML DOM 属性: innerHTML - 节点(元素)的文本值 parentNode - 节点(元素)的父节点...---- 一些 DOM 对象方法 这里提供一些您将在本教程中学到的常用方法: 方法 描述 getElementById() 返回带有指定 ID 的元素。

31830

DOM Core 与 HTML-DOM

HTML是将数据 和显示混在一起,而XML则是将数据和显示分开来。那为什么能使用DOM访问和操作HTML文档(即网页)呢?...HTML与 XHTML网页形成的节点树(统称为HTML节点树)在结构上与XML节点树一样,可以看做是一个符合DOM的XML文档,因此可以使用实现了DOM的程序语言(如JavaScript、PHP等)来访问和操作...3.DOM Core和HTML-DOM 由于HTML与XML的相似性及差异,JavaScript不仅实现了标准的DOM方法和属性(即由W3C制定的),而且还实现了HTML特有的 DOM方法和属性,前者称为...DOM Core,并不专属于JavaScript,后者称为HTML-DOM。...不管是DOM Core还是HTML-DOM,我们在使用JavaScript的时候要注意浏览器之间的兼容性,因为不同的浏览器对这两类方法和属性的支持可能不一样。

1.8K10

HTML DOM 学习

HTML DOM 学习 By: Mirror王宇阳 DOM 文档对象模型 DOM简单来说就是文档对象模型,当一个HTML页面被加载就会创建HTML页面的DOM ?...JavaScript的“权利”: 改变页面中DOM的所用的HTML元素 改变页面中DOM的所用的HTML属性 改变页面中DOM的所用的CSS样式 添加/删除DOM中所用的HTML元素、属性和CSS样式属性...对页面中所有已存在的HTML事件作出反应 可以在DOM中创建新的HTML事件 DOM的特性: 整个HTML页面文档就是一个文档节点(只存在一个 根元素) 每一个HTML内的标签是一个元素节点...每一个HTML元素中的文本是文本节点 每一个HTML属性中的内容是属性节点 注释内容属于注释节点 DOM的节点: doucument 文档节点;HTML文档的父节点,DOM文档的根节点 element...代码内容 innerText 表示起始标签和结束标签之间的纯文本内容 outerHTML 整个DOM节点的HTML和文本内容,包含标签自身 outerText 表示起始标签和结束标签之间的纯文本内容 DOM

92120

HTML5-类库系列 原生DOM功能函数

HTML5学堂:今天我们抛开框架,书写一些DOM操作方面的功能。相信用过JQ的人,绝对不会使用原生DOM进行某些效果的实现。...原因很简单,在原生DOM当中需要处理各种问题——主要是非标签节点也会成为查找的内容。...= 1) { targetEle = targetEle.previousSibling; } return targetEle; } 3、可控层数的父级元素查找 DOMParent 这个函数的作用与前两者不同...,并非是单纯的筛选节点,而是进行了功能扩充,增加了一个参数,让用户可以控制查找父级元素的层数,如直接查找id名为con的父级的父级元素,在这个函数中也是可以做到的。...= 1) { nowEle = nowEle.previousSibling; } return nowEle; } 5、下一个兄弟标签 DOMNext 这个函数功能的原理和最初两个类似,因此直接上代码

95480
领券