- 浏览: 239804 次
- 性别:
- 来自: 济南
文章分类
- 全部博客 (205)
- jQuery (27)
- Flash AS3.0 (0)
- Html5+CSS3 (12)
- C# .Net (19)
- Xml XPath XSLT (5)
- Sql (3)
- JavaScript (20)
- struts2 (23)
- hibernate (24)
- spring (11)
- j2ee (16)
- jsp/java (11)
- 设计模式 (5)
- json (3)
- Java.IO (7)
- Java.Util (7)
- android (8)
- WebService (10)
- MyEclipse SVN (3)
- servlet (1)
- Exception (3)
- 自我学习 (2)
- UML (2)
- java泛型 (1)
- Lucene (7)
- HtmlParser (2)
- 概念理解 (3)
- 正则表达式 (1)
- EMail (1)
最新评论
-
hanmiao:
没用,干巴巴的壹堆代码,没明白到底区别在哪里。
List Set Map 区别! -
e421083458:
偶来过了!
C#单向链表的实现
脚本化文档DOM总结
- 博客分类:
- JavaScript
脚本化文档DOM
1.选取文档元素
1:document.getElementById();通过ID选取文档元素
2:document.getElementsByName();通过名字选取文档元素
3:document.getElementsByTagName();通过标签选取元素
2.文档结构和遍历
Document对象,它的Element对象和文档中表示的文本的Text对象都是Node对象。Node定义的几个属性:
1:parentNode:该节点的父节点
2:childNodes:该节点的子节点,是一个数组对象(NodeList对象)
3:firstChild、lastChild:该节点的子节点的第一个和最后一个,如果没有子节点则为NUll
4:nextSibling、previousSibling:该节点的的兄弟节点的前一个节点和后一个节点,具有相同父节点的二个节点为兄弟节点,节点的顺序反映了它们在文档中出现的顺序,这二个属性节点之间以双向链表的形式连接起来。
5.nodeType:该节点的类型:
9代表Document节点;
1代表Element节点;
3代表Text节点;
8代表Comment节点;
11代表DocumentFrament节点;
6.nodeValue:Text节点和Comment节点的文本内容;
7.nodeName:元素的标签名,以大写字母形式表示;
2.属性
a) getAttribute();
b) setAttribute();
c) Document.body.attribute[0];
d) Docuemnt.body.attribute.bgColor;
e) Document.body.attribute["onload"];
3.作为纯文本的元素内容
a) textContent;
b) innerText;
c) innerHTML
4.创建、插入、删除节点
a) 元素节点:document.createElement("<script>");
b) Text节点:document.createTextNode("text node content");
c) 插入节点:parent.appendChild(child); node.insertBefor();
d) 注:在该节点后面添加一个节点:先获取一个nextSibling对象,然后中在调用insertBefor();
5.删除和替换节点
a) n.parentNode.removeChild(n);
b) n.parentNode.replaceChild(docuemnt.createTextNode("[redacted]"),n);第一个是新节点,第二个是代替节点
6.DocumentFragment作为一个临时的容器,做一个暂时存储的Docuemnt
7.文档坐标和视口坐标
a) scrollLeft:
b) scrollTop:
c) innerWidth innerHeight 是IE9以上的版本支持
d) clientWidht clientHeight 是IE所有浏览器都支持
e) Var box = e.getBoundingClientRect(); 有四个属性left right top bottom
f) Var offsets = e.getScrollOffsets(); 有二个属性 x y;
8.元素尺寸、位置 和溢出信息
a) offsetWidth offsetHeight offsetLeft offsetTop offsetParent
b) clientWidth clientHeight clientLeft clientTop
c) scrollWidth scrollHeight scrollLeft scrollTop
发表评论
-
JavaScript的一个简单闭包写法
2012-10-31 14:11 995闭包是将变量隐藏起来,通过入口调用其变量方法一: funct ... -
JS中的事件传播和默认事件取消
2012-10-20 20:50 17110<!DOCTYPE html PUBLIC " ... -
JS事件监听总结
2012-10-20 18:28 1043<!DOCTYPE html PUBLIC " ... -
JS中CSS Style标签对照表
2012-10-18 22:31 804写js时会用到,如果发现自己想要的效果没有实现,而程序没问题的 ... -
脚本化文档DOM之二
2012-10-18 18:27 803<!DOCTYPE html PUBLIC " ... -
脚本化文档DOM之一
2012-10-18 16:59 645<!DOCTYPE html PUBLIC " ... -
类和原型的关系
2012-10-10 16:59 940//类和原型的关系:类的所有实例对象都从同一个原型对象上继承属 ... -
ECMAScript5----定义的一个方法
2012-10-05 23:17 852var as = Object.create({x:1,y:2 ... -
javascript属性检测方法
2012-10-05 23:01 806//属性检测 //in 检测 var o = {x:1}; ... -
关联数组的格式
2012-10-05 22:38 0<script> var arr = { ... -
juqery插件---jAskDialog插件
2012-07-11 16:45 913(function($){ var sVar_G = &q ... -
javascript 创建对象
2012-05-14 11:03 730function Point(lng,lat) { this ... -
用javascript动态加载不同css/js文件
2012-03-20 09:13 1600DynamicLoad.js文件代码如下:function D ... -
jquery 定义插件
2012-03-13 14:12 800$.fn.Poshytip = function (o ... -
javascript的中文转换Native2Ascii桌面版.jar
2011-12-27 13:13 723javascript的中文转换Native2Ascii桌面版 -
把汉字转换成ascii编码
2011-12-26 15:48 903CMD:native2ascii -
javascript 的正则表达式
2011-09-19 12:26 631var tel = document.theForm.tel. ... -
jQuery关于Tag的插件
2011-08-04 21:24 1207$("#orderDaoHang").Ta ... -
js在线编辑器其中一个上传图片功能
2011-07-13 22:04 1264img.html <script language=&q ... -
js 正则表达写法
2011-06-11 13:06 2563一 javascript正则表达式的基本知识 1 j ...
相关推荐
IE4拥有一个革命性的DOM:它允许访问一个文档中的所有元素,并且允许以很多有趣的方式来脚本化很多元素。需要的话,它甚至允许改变一个文档的文本,重新排列文档的段落。Microsoft的API叫做IE4 DOM。它并没有标准化...
基于Jscript脚本技术的SVG文档的DOM解析.pdf 摘要: 主要介绍了S V G文档的D O M编程接口, 并结合所设计的网络化测试系统中测试结果曲线的We b发布这一功能. 提 出了利用J s c r i p t 脚本技术和中间层“ 数据池...
2,通过控制台查看目的网页的DOM文档树,执行JavaScript脚本, 界面介绍: 1, 命令历史窗口:保存命令的历史 2, 命令窗口 直接输入javascript语句,如:document.title; 将返回被调试页面的页面标题; ...
W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。 DOM DOM中有很多对象,其中一些是用户可以操纵的,如urI,location,refelter等。 客户端的脚本...
DOM 脚本注入器 在 html 文档中注入/删除脚本、样式表。 安装 npm install dom-scripter 进口 根据您的用例,有不同类型的分发。 本质上,该包可以通过 require 导入: const DOMScripterLib = require ( 'dom-...
根据报告中每条失效脚本的XPath和value信息,通过遍历新旧应用网页差异文档对象化模型解析树(DOM tree),找到替换失效脚本的路径或value值,从而修复失效的测试脚本。实验结果表明,该方法对修复失效测试脚本是...
DOM编程详解(含HTML部分)DOM是Document Object ...简单理解,DOM解决了Netscape的Javascript和Microsoft的Jscript之间的冲突,给予web设计师和开发者一个标准的方法,让他们来访问他们站点中的数据、脚本和表现层对像。
什么是DOM DOM的全称是Document Object Model,即文档对象模型,它允许脚本控制Web页面、窗口和文档。 如果没有DOM,JavaScript将是另外一种脚本语言;而有了DOM,它将成为制作动态页面的强有力工具。DOM不是...
javascript.chm Prototype_1.5.1_rc1_中文开发...DOM帮助文档.chm dom_chs_CodePub.chm XMLDOM对象方法手册.chm JavaScript宝典.chm xml_基础学习完全手册.chm HTML基础.chm Cascading Style Sheet 样式表中文手册.chm
7.1.1 语义化XHTML和DOM 7.1.2 JavaScript和XMLHttpRequest对象 7.1.3 XML 7.1.4 一个可重用的对象 7.1.5 Ajax是正确的选择吗 7.2 为什么Ajax会破坏网站及如何解决 7.2.1 依赖...
从颇具深度的JavaScript语言基础到作用域(链),从引用类型到面向对象编程,从极其灵活的匿名函数到闭包的内部机制,从浏览器对象模型(BOM)、文档对象模型(DOM)到基于事件的Web脚本设计,从XML(E4X)到Ajax及JSON,从...
通过重复的预防和完成回调支持将脚本和样式注入DOM 用法 完整的API文档。 var dominject = require ( 'dominject' ) var element = dominject ( { type : 'script' , url : '//some-url.js' , attrs : { } , //...
Javascript-DOM 文档对象模型(DOM)是HTML和XML文档的编程接口。 它代表页面,以便程序可以更改文档的结构,样式和内容。... DOM是网页的面向对象的表示形式,可以使用诸如JavaScript之类的脚本语言进行修改。
文档对象模型(DOM)属于VBScript客户端扩展部分,在文档对象模型中提供了大量的对象,这些对象应用于浏览器上,这些对象在我们编写脚本时发挥着重要的作用
document 文档 浏览器加载的页面 DOM O:object 对象 页面及页面中的任何元素都是对象 M:module 模型 页面中的元素的组织形式 DOM被W3C组织设计为一种平台无关、语言无关的API,程序或脚本通过其动态访问、修改文档的...
大部分Greasemonkey用户脚本都是自行撰写,使用对某网站专用的JavaScript代码,通过文档对象模型(DOM)接口对网页内容做操作。userscripts.org维护了个Greasemonkey数据库。该数据库描述哪个网址网页对应到哪个脚本...
文档对象模型(DOM)属于VBScript客户端扩展部分,在文档对象模型中提供了大量的对象,这些对象应用于浏览器上,这些对象在我们编写脚本时发挥着重要的作用。
基于Jscript脚本技术的SVG文档的DOM解析.pdf 基于SVG 技术的考古探测WebGIS 研究.pdf 基于SVG的WebGIS的设计与实现.pdf 基于SVG的WebGIS建设电力生产管理信息系统.pdf 基于SVG的公共图形交互规则.pdf 基于SVG的实时...
集合了前台脚本,sql语句,多语言的帮助文档,HTML教程 HTML XHTML CSS TCP/IP XML教程 XML DTD XML DOM XSL XSLT XSL-FO XPath XQuery XLink XPointer Schema XForms SOAP WSDL RDF RSS WAP ...