JavaScript DOM文档遍历-JS查找父节点、子节点、同级节点

 2015年10月25日    3205

W3C规范中,将文档对象模型 (DOM) 表示为一棵树,该树由具有属性和方法的不同层次的节点组成。使用 JavaScript对这颗数的节点进行添加、修改、删除等操作时,首先我们需要找到对应的节点。在DOM中,Document对象表示文档的根节点,即:树的根节点,可以通过window.documentdocument访问该对象。Document对象中包含一些Node(节点)对象,Node对象可以是ElementText等对象。Node对象提供了一些属性,通过这些属性可以查找文档中的指定位置的元素。

阅读全文

使用ECMAScript 6 的Promise对象实现JavaScript深度嵌套回调的顺序链式调用

 2015年10月23日    587

Promise是ES 6中新增的对象,Promise质上是一种对异步处理的规范。Promise非常适合处理JS深度嵌套回调的问题,通过Promise处理回调可以使代码更简洁也更易读。主流浏览器(IE除外)的最新版本,已经提供了对ECMAScript 6的支持。Node.jsV 4.0+起,开始原生支持ECMAScript 6。所以,现在使用Promise已不需要额外引用包或模块,本文将分别介绍在浏览器中和在Node.js中使用Promise的链式调用。

阅读全文

JavaScript 获取DOM文档元素

 2015年10月06日    846

浏览器端的JavaScript运行时对HTML页面的操作,其本质是在操作一个或多个文档。程序启动后,文档会被抽象为Document对象,通过全局变量document可以获取对这个对象的引用。为了操作文档中的元素(Element对象),需要通过document获取这些元素。在W3CDOM规范中定义了选取元素的方法。

阅读全文

JavaScript DOM事件处理-事件捕获和事件冒泡

 2015年10月06日    966

在浏览器端JavaScript事件驱动的异步编程模式下,如果JavaScript关注特定类型的事件,那么就可以为事件注册事件处理程序。在DOM文档中,当事件发生时会逐级向上传递,并最终传递给文档树。如果DOM元素注册过事件处理程序,当事件传递到对应位置就会被事件处理程序(注册的函数)所处理。这种事件传播机制叫做事件“冒泡”。

阅读全文

JavaScript DOM文档事件-DOM0、DOM2级事件处理程序

 2015年10月04日    1254

浏览器端的JavaScript采用的是事件驱动的异步编程模型。在这种设置模式下,当文档、浏览器、元素或与之相关的对象发生某些事情时,浏览器就会产生对应的事件(event)。事件是JavaScript和HTML DOM交互的基础,DOM元素支持的每种事件,都可以使用一个与相应事件处理程序(事件监听)通过相应HTML属性来指定。添加DOM元素事件处理程序,可以使用DOM0级的方式添加,也可以使用DOM2级的方式添加。

阅读全文

JavaScript和DOM的产生与发展

 2015年10月03日    946

JavaScript历经了从被人误解到现在的被万众瞩目的转变。随着一些JavaScript编程规范的推出(如:AMDCMD),其应用范围也从前端一些小功能逐渐扩展到后端和一些大项目中。那么,JavaScript从混乱无序到严谨规范经历的哪些过程,在这些过程中又JavaScript增加了哪些功能特性?

阅读全文

为什么XMLHttpRequest的POST请求会变OPTIONS请求-XMLHttpRequest对象对HTTP请求的访问控制(CORS跨站资源共享)

 2015年09月22日    11616

要使用XMLHttpRequest对象POST请求不在同一域名下的一个站点,即:跨域请求,请求数据格式为JSON。因此需要使用setRequestHeader()方法设置Content-Type'application/json。设置完这个自定义的HTTP Headers后,发现原本可以跨域POST请求失效了。调试对应的服务端代码,发现POST请求变成了OPTIONS请求。这与CORS(Cross-Origin Resource Sharing,跨站资源共享)策略有关,设置Content-Type后,CORS简单请求变为Preflighted 请求。在Preflighted 请求中,XMLHttpRequest对象会首先发送OPTIONS嗅探,以验证是否有对指定站点的访问权限。

阅读全文

addEventListener、removeEventListener与事件处理程序

 2015年09月22日    3005

事件处理程序又叫做事件监听器,addEventListener()removeEventListener()是“DOM2级事件”中定义的两个方法,分别用于添加和删除事件处理程序。所有的DOM节点中都包含这两个方法,并且它们都接受3个参数:要处理的事件名、要为事件添加的处理程序的函数和一个表示事件处理阶段的布尔值。详见下文……

阅读全文