DOM 事件流描述了 DOM 时间响应的阶段、路径。 DOM 事件流也会被称为 DOM 事件模型。 1. 事件流阶段 事件流有三个阶段: 捕获阶段 从window开始,寻找触发事件最深层的节点,过程中如果有节点绑定了对应事件,则触发事件 目标阶段 找到事件触及的最深节点 冒泡阶段 从最深节点按照捕获的路径进行返回,过程中如果有节点绑定了对应事件,则触发事件 现代浏览器默认都会在冒泡阶段触发事件。
Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。(W3C) 事件对象会在事件被触发时获得,对象包含了当前事件的一些信息,如点击事件可以获取到点击的位置,键盘输入事件可以获取到按下的键。 1. 获取事件对象 在给 DOM 节点绑定事件时,需要传递一个事件处理器,其本质上是个函数,在事件触发时被调用。 在事件处理器被调用时,默认就会传递一个参数,这
DOM 提供了许多事件供开发者进行绑定,以响应各种操作,丰富页面交互。 想要触发事件,就得先给 DOM 节点绑定事件,提供事件处理器。 1. 直接在 HTML 上提供事件 这种方式是将事件内联在 HTML 代码中。 案例演示 预览 复制 复制成功! <style> .box { width: 100px; height: 100px; background: green
事件是您在编程时系统内发生的动作或者发生的事情,系统通过它来告诉您在您愿意的情况下您可以以某种方式对它做出回应。例如:如果您在网页上单击一个按钮,您可能想通过显示一个信息框来响应这个动作。在这篇文章中我们将围绕事件讨论一些重要的概念,并且观察它们在浏览器上是怎么工作的。这篇文章并不做彻底的研究仅聚焦于您现阶段需要掌握的知识。—— MDN 事件即某个情况、某个事情。 当按钮被点击 视频播放、暂停 关
DOM 节点也会被称为 DOM 元素。 想要操作 DOM 节点,就必须先获取到 DOM 节点。 1. 获取 DOM 节点 获取 DOM 节点的方式有很多,这里例举几个常用的,所有的 DOM 元素都具有以下方法: element.getElementById element.getElementByName element.getElementByTagName element.getElement
DOM 与 JavaScript 是分离的。 DOM 有自己的一套标准,JavaScript 也有自己的一套标准。 JavaScript 是对标准的实现,为一种语言,而 DOM 标准定义了一系列的接口,由此可以看出,他们两者是可以毫不相干的。 但是在 Web 开发中,页面内容的展示全部通过浏览器解析展现,JavaScript 想动态的修改页面,就必须由浏览器提供一些方法,交给开发者来操作页面上的元
文档对象模型 (DOM) 是HTML和XML文档的编程接口。它提供了对文档的结构化的表述,并定义了一种方式可以使从程序中对该结构进行访问,从而改变文档的结构,样式和内容。DOM 将文档解析为一个由节点和对象(包含属性和方法的对象)组成的结构集合。简言之,它会将web页面和脚本或程序语言连接起来。(MDN) DOM (Document Object Model,文档对象模型) 是 W3C 制定的访问
类型:HTMLDomElement,绘图容器。
得到一个 ZRender 的实例,实例属性及方法参见实例 API。 参数 名称 类型 默认值 描述 dom HTMLElement ZRender 容器,在调用该方法时,应该已有宽度和高度。 opts Object 配置项 opts.renderer string 'canvas' 渲染方式,支持:'canavs'、'svg'、'vml' opts.devicePixelRatio number
Another class of functions that is often considered difficult to test is code that directly manipulates the DOM. Let's see how we can test the following snippet of jQuery code that listens to a click
Element 类型 除了 Document 类型之外,Element 类型就要算是 Web 编程中最常用的类型了。Element 类型用于表现 XML 或 HTML 元素,提供了对元素标签名、子节点及特性的访问。Element 节点具有以下特征: nodeType 的值为1; nodeName 的值为元素的标签名; nodeValue 的值为 null; parentNode 可能是 Docum
DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API。DOM 描绘了一个层次化的节点树,允许开发人员添加、移除和修改页面的某一部分。 节点层次 DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构。节点分为几种不同的类型,每种类型分别表示文档中不同的信息及(或)标记。每个节点都拥有各自的特点、数据和方法,另外也与其他节点存在某种关系。节点之间的关系构成了层
利用DOM方法创建元素节点,通常要将document.createElement()、document.createTextNode()、appendChild()配合使用,十分麻烦。 而jQuery使用$就可以直接创建DOM元素 var oNewP = $("<p>使用jQuery创建的内容</p>"); 以上代码等同于javascript var oNewP2 = docume
1.设置单选按钮 单选按钮在表单中即<input type="radio" />它是一组供用户选择的对象,但每次只能选一个。每一个都有checked属性,当一项选择为ture时,其它的都变为false. 先贴沙漠化一个例子: <script type="text/javascript"> function getChoice() { var oForm =
1.控制用户输入的字符个数 对于单行文本框和密码输入框,可以利用maxlength属性控制用户输入的字符个数。 对于多行文本,maxlength为自定义属性,其值最多输入的字符的个数,在onkeypress事件发生时则调运返回LessThan()函数返回值,函数如下 <textarea name="comments" id="comments" cols="40" rows="4" maxleng