【DOM2练习】的更多相关文章

DOM0,DOM2,DOM3 事件基础知识

事件是javascript和HTML交互基础, 任何文档或者浏览器窗口发生的交互, 都要通过绑定事件进行交互; 事件有DOM0, DOM2和DOM3的区分(别问我怎么少了一个DOM1, 也没找到DOM1的信息啊,); DOM0就是直接通过 onclick写在html里面的事件, 比如: <input onclick="alert(1)" /> DOM2是通过addEventListener绑定的事件, 还有IE下的DOM2事件通过attachEvent绑定; DOM3是一些…

译：DOM2中的高级事件处理（转）

17.2. DOM2中的高级事件处理(Advanced Event Handling with DOM Level 2)        译自:JavaScript: The Definitive Guide, 5th Edition ----By David Flanagan         迄今为止,在本章中出现的事件处理技术都是DOM0级的一部分,所有支持JavaScript的浏览器都支持DOM0的API.DOM2定义了高级的事件处理API,和DOM0的API相比,有着令人瞩目的不同(而且功…

dom2和dom3

第十二章 DOM2和DOM3 一.DOM变化 1.针对XML命名空间的变化 2.其他方面的变化 二.样式 1.访问元素的样式             .style             1)DOM样式属性方法                 cssText:访问style特性中的CSS代码                 length:应用给元素的CSS属性数量                 parentRule:表示CSSRule对象                 getProperty…

12. javacript高级程序设计-DOM2和DOM3

1. DOM2和DOM3 DOM2级规范定义了一些模块,用于增强DOM1级.“DOM2级核心”为不同的DOM类型引入了一些与XML命名空间有关的方法,这些变化只在使用XML或者XHTML,对于HTML文档没有实际意义.除了与XML命名空间有关方法外,“DOM2核心”还定义了以编程方式创建Document实例的方法,也支持了创建DocumentType对象. “DOM2级样式”模块主要针对操作元素的样式信息而开发,其简要特性总结如下: l 每个元素都有一个关联的style样式,可以用来确定和修改行…

W3C对DOM2.0定义的标准事件

DOM2.0模型将事件处理流程分为三个阶段: 一.事件捕获阶段, 二.事件目标阶段, 三.事件起泡阶段. 具体如图(图片来源于网络,侵删) 事件捕获:当某个元素触发某个事件(如onclick),顶层对象document就会发出一个事件流,随着DOM树的节点向目标元素节点流去,直到到达事件真正发生的目标元素.在这个过程中,事件相应的监听函数是不会被触发的. 事件目标:当到达目标元素之后,执行目标元素该事件相应的处理函数.如果没有绑定监听函数,那就不执行. 事件起泡:从目标元素开始,往顶层元素传播.…

DOM--3 DOM核心和DOM2 HTML(3)

核心Element对象 操作Element对象的属性 为了简化对attributes的处理,Element对象中包含了很多用来操纵Node对象的attributes属性的方法: getAttribute(name); setAttribute(name, value); removeAttribute(name); 类似地,还有一些使用DOM Attr节点对象来操纵属性的方法: getAttributeNode(name)方法取得指定属性的Attr节点 setAttributeNode(newA…

DOM--3 DOM核心和DOM2 HTML(2)

核心Node对象 由于继承扩展的关系,DOM中大部分对象会有Node对象的属性和方法,其中包括: nodeName DOM2核心中规定的每种nodeType预期的nodeName值 对象 返回值 Element.nodeName 元素的名称,大写 Attr.nodeName 属性的名称,大写 Text.nodeName #text CDATASection.nodeName #cdata-section EntityReference.nodeName 实体引用的名称 Entity.nodeNa…

DOM--3 DOM核心和DOM2 HTML(1)

网页是一种结构化的文档,使用一组预定义的XML和HTML标签进行标记:当浏览器接受到网页文档时,会根据文档类型和关联的样式表对其进行解析,然后以可视化形式显示在屏幕上. DOM是一组用来描述脚本怎样与结构化文档进行交互和访问的Web标准,DOM定义来一系列对象.方法和属性,用于访问.操作和创建文档中的内容.结构.样式和行为 DOM的级别 DOM 0级 一般指在标准之前的一些特性,不同浏览器实现不一 DOM 1级(1998) DOM Core:为XML规定了树形节点结构,同时给出了创建.编辑和操纵…

DOM0,DOM2,DOM3事件,事件基础知识入门

事件是javascript和HTML交互基础, 任何文档或者浏览器窗口发生的交互, 都要通过绑定事件进行交互; 事件有DOM0, DOM2和DOM3的区分(别问我怎么少了一个DOM1, 也没找到DOM1的信息啊,); DOM0就是直接通过 onclick写在html里面的事件, 比如: <input onclick="alert(1)" /> DOM2是通过addEventListener绑定的事件, 还有IE下的DOM2事件通过attachEvent绑定; DOM3是一些…

读JS高级API笔记_(DOM&&DOM2&&DOM3)哎呀——园龄才9个月啊

---恢复内容开始--- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&…

dom0级事件和dom2级事件

dom0级事件 <a href="#" id="hash" onclick="fn();fn1();"> <button type="button">返回上面进行开通</button> </a> var btn=$('#hash').get(0); btn.onclick=function(){ alert('111'); }; btn.onclick=function(){ a…

JavaScript DOM高级程序设计 3.-DOM2和HTML2--我要坚持到底！

由一个HTML进行说明,我就不敲了,直接copy <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>AdvancED…

js 中用Dom2级事件处理函数(改变样式)

下面这些客户端 javascript代码用到了事件,它给一个很重要的事件--“load" 事件注册了一个事件处理程序.同时展示了注册”click“事件处理函数更高级的一种方法 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <b…

JavaScript 【非IE DOM2级XML】

DOM2中的XML IE可以实现了对XML字符串或XML文件的读取,其他浏览器也各自实现了对XML处理功能.DOM2级在document.implementaion中引入了createDocument()方法.IE9.Firefox.Opera.Chrome和Safari都支持这个方法. var xmlDom = document.implementation.createDocument("", "root", null); //1 命名空间 2 跟表亲 3 文档…

测试DOM0级事件和DOM2级事件的堆叠

1. 问题 如果大家看过北风网CJ讲师的Javascript视频教程,就可以看到其封装了一个很强的事件添加和删除函数,如下所示 function addEvent(obj, evtype, fn) { //符合W3C的事件模型 if (obj.addEventListener) { obj.addEventListener(evtype,fn,false); return obj; } //IE或Opera浏览器 if (!obj.functions) obj.functions={}; if…

DOM的发展，DOM0,DOM1,DOM2,DOM3

Documentc Object Model文档对象模型是针对XML但经过扩展用于HTML的应用程序接口(API Application programming Interface).DOM把整个界面都映射成多层次节点结构,每个组成部分都是某种类型的节点,通过DOM可以操作任何节点. DOM由来 因为Internet Explorer4和Netscape Navigation4分别支持不同的DHTML(动态HTML),负责制定web通信标准的W3C(World Wide Web Consorti…

DOM0 DOM2 DOM3

DOM0  DOM2  DOM3 DOM是什么 W3C 文档对象模型 (DOM) 是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容.结构和样式. DOM 定义了访问 HTML 和 XML 文档的标准: W3C DOM 标准被分为 3 个不同的部分: 核心 DOM - 针对任何结构化文档的标准模型 XML DOM - 针对 XML 文档的标准模型 HTML DOM - 针对 HTML 文档的标准模型 DOM 是 Document Object Model(文档对象模型)的缩写.…

Javascript事件模型(一)：DOM0事件和DOM2事件

javascript事件模型,本文主要有以下内容: DOM0事件模型 DOM2事件模型  一.DOM0事件模型 早期的事件模型称为DOM0级别. DOM0的事件具有极好的跨浏览器优势, 会以最快的速度绑定, 如果你通过DOM2绑定要等到JS运行, DOM0不用, 因为DOM0是写在元素上面; 直接在dom对象上注册事件名称,就是DOM0写法,比如: document.getElementById("test").onclick = function(e){}; 另外一种写法是: doc…

DOM0级事件处理、DOM2级事件处理

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta h…

《JavaScript高级程序设计》笔记：DOM2和DOM3（十二）

DOM1级主要定义的是HTML和XML文档的底层结构.DOM2级和DOM3级在这个结构基础上引入了更多的交互能力,也支持更高级的XML特性.为此DOM2级和DOM3级分为了很多的模块(模块直接具有某种关联),分别描述了DOM的某个非常具体的子集.这些模块如下: DOM2级核心:在1级核心基础上构建,为节点添加了更多属性和方法: DOM2级视图:为文档定义了基于样式信息的不同视图: DOM2级事件:说明了如何使用事件与DOM文档交互: DOM2级样式:定义了如何以编程方式来访问和改变CSS样式信息…

javascript高级程序设计第3版——第12章 DOM2与DOM3

12章——DOM2与DOM3 为了增强D0M1,DOM级规范定义了一些模块. DOM2核心:为不同的DOM类型引入了一些与XML命名空间有关的方法,还定义了以编程方式创建Document实例的方法: DOM2级样式:针对操作元素的样式而开发: 其特性总结: 1.每个元素都有一个关联的style对象,可用来确定和修改行内样式: 2.要确定某个元素的计算样式,可使用getComgetComputedStyle()方法: 3.IE 不支持getComputedStyle()方法,但为所有元素都提供了能…

JavaScript 之默认行为 DOM2级，事件委托机制

1. 事件默认行为及阻止方式    1.1 浏览器的默认行为       JavaScript事件本身所具有的属性,例如a标签的跳转,Submit按钮的提交,右键菜单,文本框的输入等.    1.2 阻止默认行为的方式 event.preventDefault();  event.returnValue = false;  return false; //IE低版本和其他版本都支持return false,而其他两种IE低版本不支持. <a href="">click he…

DOM1级问题与DOM2级事件

前几天有小伙伴问过我一个问题,为什么有DOM 0级事件以及DOM2级事件,但是却没有DOM1级事件呢?那我们今天就来说一说DOM的级别问题. 同时推荐伙伴们可以看看尚学堂有关JavaScript BOM的文章:<细说javascript BOM> 一.DOM0级事件 0级DOM分为两种 行内事件:在标签中写事件 元素.on事件名=函数 1.行内<input type="button" id="btn" value="按钮" on…

Javascript高级编程学习笔记（54）—— DOM2和DOM3（6）范围选择

范围 为了让开发人员更加方便地控制页面“DOM2级遍历和范围”模块定义了“范围”接口 通过该接口开发人员可以选择文档中的一个区域,而不必考虑元素的界限 在常规操作不能有效地修改文档时,使用范围往往可以达到目的 DOM中的范围 DOM2级在Document类型中定义了 createRange()方法 在兼容该接口的浏览器中,该方法属于document对象 可以使用以下代码,检测浏览器对其的兼容 var supportsRange = document.implementation.hasFeatu…

Javascript高级编程学习笔记（53）—— DOM2和DOM3（5）遍历

遍历 “DOM2级遍历和范围” 定义了两个用于辅助完成顺序遍历的DOM结构类型 NodeIterator 和 TreeWalk 上述两种类型可以基于给定起点的DOM结构执行深度优先的遍历操作 对于检测浏览器对于该功能的实现可以使用以下代码 var supportTraversals = document.implementation.hasFeature("Traversal","2.0"); var supportsNodeIterator = (typeof d…

Javascript高级编程学习笔记（52）—— DOM2和DOM3（4）元素大小

在日常实践中,我们在使用JS的时候难免会需要获取元素的大小及位置 首先要声明的是,这一部分的内容并不属于DOM2样式规范,因为DOM中并没有对我们如何获取元素大小的相关信息做出规范 偏移量 偏移量及元素在页面中的位置 要获取元素的偏移量和下方五个属性有关: offsetHeight:元素的高度(包含元素的外边框及水平滚动条) offsetWidth:元素的宽度(包含元素的外边框及垂直滚动条) offsetTop:元素的上边框到包含当前元素的元素的内上边框的距离 offsetLeft:元素的左边框…

Javascript高级编程学习笔记（50）—— DOM2和DOM3（2）样式

样式 在HTML中定义元素的方式有以下三种: 1.link标签引入外部样式表 2.style标签定义嵌入样式 3.通过JS中对style特性定义元素样式(行内样式) “DOM2级样式”围绕上述样式机制提供了一套API 若需要检测CSS2是否可用可以使用以下代码(虽然现在应该是用不着,毕竟CSS4都快普及了emmm) var supportsDOM2CSS = document.implementation.hasFeature("CSS","2.0"); var s…

Javascript高级编程学习笔记（49）—— DOM2和DOM3（1）DOM变化

DOM变化 我们知道DOM有许多的版本,其中DOM0和DOM2这两个级别以对事件的纳入标准而为人所知 但是呢,这里不讲事件,在后面会有专门和事件有关的部分作为详细讲解 这里就只讲一下DOM2和DOM3的背景来历 首先DOM1级主要定义的是HTML和XML文档底层的结构,DOM2和DOM3两个级别则主要致力于为文档引入更加丰富的交互能力 与此同时这两个版本也支持了更加高级的XML特性 首先DOM2分为了许多模块 如下所示: 1. DOM2级核心 2.DOM2级视图 3.DOM2级事件 4.DOM2…

【20190226】JavaScript-知识点记录：dom0级事件，dom2级事件

DOM0级事件处理程序: 通过将元素的事件处理程序属性(如onclick)的值设置为一个函数来指定事件处理程序的方法称为DOM0级方法,它被认为是元素的方法,这时候的事件处理程序是在元素的作用域中运行(也就是this引用当前元素): var btn = document.getElementById('myBtn'); btn.onclick = function(){ alert(this.id); }; DOM2级事件处理程序: 通过addEventListener()方法和removeEv…

javascript中DOM0,DOM2,DOM3级事件模型解析

DOM 即 文档对象模型. 文档对象模型是一种与编程语言及平台无关的API(Application programming Interface),借助于它,程序能够动态地访问和修改文档内容.结构或显示样式. DOM3级,顾名思义,有三种DOM. W3C协会早在1988年就开始了DOM标准的制定,W3C DOM标准可以分为DOM1,DOM2,DOM3三个版本. DOM1级主要定义的是HTML和XML文档的底层结构. DOM1 主要定义的是HTML和XML文档的底层结构.其实世上本来没有DOM0级,…