`
- 浏览:
1479995 次
-
dom解释：通过javascript，您可以重构整个html文档，您可以添加、移除、改变或重排页面上得项目，要改变页面上得某个元素，javascript需要获得对html文档中所有元素进行访问的入口，这个入口，连通对html元素进行的添加、移动、改变或移除的方法和属性，都是通过文档对象模型来获得的(DOM)
dom分为不同的部分(核心、xml和html)和级别(dom level 1/2/3)
dom规定：
整个文档是一个文档节点
每个html标签是一个元素节点
包含在html元素中得文本是文本节点
每一个html属性是一个属性节点
注释属于注释节点
节点的一些概念：
父节点：除文档节点之外的每个节点都有父节点
子节点：大部分元素节点都有子节点
同辈：当节点分享同一个父节点时，它们就是同辈(同级节点)
后代：节点也可以拥有后代，后代指某个节点的所有子节点，或者子节点的子节点
先辈：节点也可以拥有先辈，先辈是某个节点的父节点，或者父节点的父节点
getElementById()语法：
通过指定的id返回元素，单个元素
getElementByTagName()语法：
此方法会使用指定的标签名返回所有的元素(作为一个节点列表)，这些节点是使用此方 法时所处的元素的后代
如：
var x = document.getElementByTagName("p");
for(var i = 0;i < x.length;i++){
var y = x[i];
}
parentNode、firstChild、lastChild
parentNode属性常被用来改变文档的结构，架设您希望从文档中删除某一个元素：
x.parentNode.removeChild(x);
根节点
有两种特殊的文档属性可用来访问根节点：
document.documentElement 返回存在于xml以及html文档中得文档根节点
document.body 是对html页面的特殊扩展，提供了对<body>标签的直接访问
节点信息
每个节点都拥有包含着关于节点某些信息的属性，
nodeName 节点名称
nodeValue 节点值
nodeType 节点类型
nodeName属性含有某个节点的名称，元素节点的nodeName是标签名称，属性节点的node Name是属性名称，文本节点的nodeName永远是#text，文档节点的nodeName永远是#document
nodeValue:对于文本节点，nodeValue属性包含文本，对于属性节点，nodeValue属性包含属性值，nodeValue对文档节点和元素节点不可用
nodeType属性返回节点的类型：1元素，2属性，3文本，8注释，9文档
分享到：
Global site tag (gtag.js) - Google Analytics
相关推荐
JavaScript获取HTMLDOM节点元素的方法的总结
DOM 总结 DOM 实例 DOM 实例 DOM 对象 DOM Window DOM Navigator DOM Screen DOM History DOM Location DOM Document DOM Anchor DOM Area DOM Base DOM Body DOM Button DOM Event DOM Form DOM ...
目录如下： 1. DOM可以做什么？ 2. DOM的结构 3. 访问DOM节点1——getElementById() 4. 访问DOM节点2——getElementsByTagName() 5. 访问DOM节点3——通过节点关系 6. DOM节点信息 ...11. DOM简介总结
HTML DOM 事件允许Javascript在HTML文档元素中注册不同事件处理程序。 事件通常与函数结合使用，函数不会在事件发生前被执行！ (如用户点击按钮)。 提示： 在 W3C 2 级 DOM 事件中规范了事件模型。
文章目录DOM总结1、DOM1）DOM结构2）DOM节点a、节点分类b、节点之间的关系c、选择器——找到节点3）DOM修改a、innerTextb、innerHTMLc、 属性 ： value，style ，width2、DOM操作1） 单个HTML DOM节点的操作a、找到...
在Web应用程序特别是Web2.0程序开发中，经常要获取页面中某个元素，然后更新该元素的样式、...令人欣慰的是，使用JavaScript获取节点的方法有很多种，这里简单做一下总结（以下方法在IE7和Firefox2.0.0.11测试通过）：
我个人认为适合初学，当然这里是100个例子，只对dom操作的，希望大家注意总结 ，总结成自己的才是最好的，是哪个网站的例子我也忘记了，呵呵。 弘扬开源精神，杜绝积分下载
当页面加载时，浏览器会创建页面的文档对象模型（Document Object Model）。文档对象模型定义访问和处理HTML文档的标准方法，本篇文章给大家介绍javascript dom 学习总结(五)，感兴趣的朋友一起学习吧
什么是HTML DOM 文档对象模型（Document Object Model），是W3C组织推荐的处理可扩展置标语言的标准编程接口。简单理解就是HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。我们用JavaScript对网页进行...
【前端 HTML+CSS+JavaScript(JS)】DOM练习-onkeydown键盘事件-用wasd移动图片的位置 带注释/总结 【前端 HTML+CSS+JavaScript(JS)】DOM练习-onmouseover事件 鼠标悬浮切换图片 带注释/总结 【前端 ...
令人欣慰的是，使用JavaScript获取节点的方法有很多种，这里简单做一下总结（以下方法在IE7和Firefox2.0.0.11测试通过）： 1. 通过顶层document节点获取： （1） document.getElementById(elementId)：该方法通过...
DOM添加元素,使用节点属性 DOM添加元素,使用节点属性 Item 1 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]一、DOM基础1.节点(node)层次Document－－最顶层的节点，所有的其他节点都是附属于它的。...
DOM总结 tomcat服务器 servlet基础 Request&Response编程 Cookie&Session XML语言 JSP技术入门 EL表达式语言 JSTL标签库： JSP标准标签库 MVC程序架构思想&案例 [总结]Path路径问题 [总结]JavaWeb乱码问题 [转自IBM]...
本文实例总结了jQuery常见的遍历DOM操作。分享给大家供大家参考，具体如下： 向上遍历DOM树 .parent():返回被选元素的直接父元素,该方法只会向上一级对DOM树进行遍历 .parents():返回被选元素的所有祖先元素，一直...
下文主要通过一个例子带你 分析DOM事件的传递、事件处理 ，然后在此基础上再 深入总结对事件监听的优化方案 ，最终总结下DOM事件机制 在开源框架中的实战应用 。 一、从实例看事件传递 以下面这个普通的html...
令人欣慰的是，使用JavaScript获取节点的方法有很多种，这里简单做一下总结（以下方法在IE7和Firefox2.0.0.11测试通过）： 1. 通过顶层document节点获取： （1） document.getElementById(elementId)：该方法通过...
主要介绍了JavaScript DOM节点操作,结合实例形式总结分析了JS操作DOM实现新建与删除HTML元素的具体步骤与相关技巧,需要的朋友可以参考下
1:jquery可以加载多个ready函数，而原始的js只能加载一次onload 2 2:用dom对象得到的对象不能使用jquery中的方法，比如var p=document.getElementById("id"),此时p不能这样使用p.html(),而应该使用innerHTML。...