DOM笔记
文章平均质量分 80
记录学习DOM的要点
会飞的Pikachu
前端开发手册:https://github.com/dwqs/fedHandlebook
展开
-
DOM(十四):代理检测和事件处理(跨浏览器)
一、检测 用于用户代理检测,检测范围包括浏览器引擎、平台、Windows、移动设备和游戏系统等/**用户代理检测脚本,检测范围包括浏览器引擎、平台、Windows、移动设备和游戏系统*/var client = function(){ //呈现引擎 var engine = { ie:0, //ie gecko:0, //火狐 webkit:0, //chrome和safari k原创 2015-01-11 11:36:15 · 1458 阅读 · 0 评论 -
DOM笔记(十三):JavaScript的继承方式
在Java、C++、C#等OO语言中,都支持两种继承方式:接口继承和实现继承。接口继承制继承方法签名,实现继承则继承实际的方法和属性。在SCMAScript中,由于函数没有签名,所以无法实现接口继承,只支持实现继承。实现继承主要依靠原型链来实现。一、原型链原型链是利用原型让一个引用类型继承另一个引用类型的方法,在DOM笔记(十二):又谈原型对象中,描述了构造函数、实例和原型之间的关系:每个构造函数都有一个原型对象,原型对象包含一个指向构造函数的指针,而每个实例都包含一个指向原型对象的内部指针原创 2014-12-27 11:38:22 · 1312 阅读 · 0 评论 -
DOM笔记(十二):又谈原型对象
因为之前谢过一篇关于原型对象的笔记:浅谈JavaScript中的原型模式。现在我又重新看到这个话题,对原型有了进一步的理解,所以,又要谈谈原型对象。一、理解原型对象创建的每一个函数都有一个prototype属性,它指向这个函数的原型对象。利用原型模式创建的方法和属性是被所有实例所共享的。function Person(){}Person.prototype.name="dwqs";Person.prototype.age=20;Person.prototype.sayName=functi原创 2014-12-26 10:11:45 · 1653 阅读 · 0 评论 -
DOM笔记(十一):JavaScript对象的基本认识和创建
一、什么是对象?面向对象(Object-Oriented,OO)的语言有一个标志,那就是都有类的概念,例如C++、Java等;但是ECMAScript没有类的概念。ECMAScript-262把对象定义为:无序属性的集合,其属性可以包含基本值、对象或者函数。通俗一点的理解就是,ECMAScript中的对象就是一组数据和功能的集合,通过new操作符后跟要创建的对象类型的名称来创建。每个对象都基于一个引用类型创建。引用可以是原生类型(相关介绍:引用类型),或者开发人员自定义的类型。二、Object对象原创 2014-12-25 10:00:29 · 1277 阅读 · 0 评论 -
DOM笔记(十):JavaScript正则表达式
一、RegExpECMAScript通过RegExp类型类支持正则表达式,语法和Perl类似:var exp = /pattern/flags;patternb部分是任何简单的或复杂的正则表达式;flags是每个正则表达式所带的一个或者多个标志。正则表达式的模式匹配支持三个标志:g:全局模式,即模式应用于整个字符串,而非在发现第一个匹配项时立即停止i:不区分大小写模式m:多行模式,即到达一行文本末尾是还会继续茶查找下一行中是否存在与模式匹配的项。1、创建正则表达式Java原创 2014-12-22 09:32:26 · 1707 阅读 · 2 评论 -
DOM笔记(九):引用类型、基本包装类型和单体内置对象
一、Array 1 、创建数组的方式//Array构造函数(可以去掉new)var colors0 = new Array();var colors1 = new Array(20);var colors3 = new Array("red","blue","green");//数组字面量var colors4 = ["red","blue","green"];var colors5 = []; 可以根据元素的索引对数组元素进行访问,在数组末尾增加(或者删除)元素可以用colo原创 2014-12-19 11:43:09 · 1180 阅读 · 0 评论 -
DOM笔记(八):JavaScript执行环境和垃圾收集
一、执行环境 在有关于JavaScript对象或者this的指向问题时,脱离不了的另外一个概念就是执行环境,即上下文环境。执行环境在JavaScript是一个很重要的概念,因为它定义了变量或函数有权访问的其它数据,决定了它们各自的行为。每个执行环境都有一个与之关联的变量对象,在该环境中定义的所有变量和函数都保存在这个对象中。 全局环境时最外围的一个执行环境。在Web浏览器中,全局环境被认为是Window对象(后续笔记中会讨论),因此所有的全局变量和函数都是作为window对象的属性或者方法创建的原创 2014-12-16 15:07:12 · 1205 阅读 · 0 评论 -
DOM笔记(七):开发JQuery插件
在上一篇笔记本中,讲解了如何利用jQuery扩展全局函数和对象:DOM笔记(六):怎么进行JQuery扩展?在这篇笔记本中,将开发一个简单的动画插件,名称是example-plugin,用其实现一个简单的功能:光标移动到目标标签,标签移动,改变背景色;光标离开时,标签恢复原来的样式。因为是jQuery对象的扩展,采用jQuery.fn.extend()进行扩展,插件名是dwqs,并且使用闭包:/**示例插件功能:*光标移动到目标标签,标签移动,改变背景色;光标离开时,标签恢复原来的样式*/原创 2014-12-13 13:30:47 · 1306 阅读 · 0 评论 -
DOM笔记(六):怎么进行JQuery扩展?
一、全局函数的扩展全局函数是将独立的函数添加到JQuery的命名空间中区。在使用的时候,可以通过$.fucnName(param)或者jQuery.funcName(param)方式进行调用。1、直接在JQuery上添加:在jQuery上添加一个全局函数sayHellojQuery.sayHello=function(name){alert(name+"您好");}; 调用方式:jQuery.sayHello("张子涵"); //或者用$.sayHello("张子涵");原创 2014-12-12 13:28:26 · 1116 阅读 · 0 评论 -
DOM笔记(五):JavaScript的常见事件和Ajax小结
一、常见事件类型 1、鼠标事件事件名称 说明onclick 鼠标单击时触发ondbclick 鼠标双击时触发onmousedown 鼠标左键按下时触发onmouseup 鼠标释放时触发onmouseover 鼠标的光标移动到某对象上时触发onmousemove 鼠标移动时触发onmouseout 鼠标光标离开某对象时触发ps:当单击一次鼠标左键的时候,将同时触发onclick、onmousedown、onmouseup三个事件,事件处理程序执行的先后顺序为:onmousedo原创 2014-12-11 14:52:26 · 1277 阅读 · 0 评论 -
DOM笔记(四):HTML 5 DOM复杂数据类型
HTML 5 DOM定义了一下集合、列表等复杂的数据类型用于实现便捷的操作。相对于HTML 4 DOM,HTML 5 DOM增加了HTMLCollection、DOMTokenList、DOMStringMap、HTMLAllCollection、HTMLFormControlsCollection等。一、HTMLCollection、HTMLAllCollection和HTMLFormControlsCollection 三个接口均用于表示一组元素组成的列表。HTMLAllCollecti原创 2014-12-11 08:21:27 · 1675 阅读 · 0 评论 -
DOM笔记(三):Element接口和HTMLElement接口
一、Element接口 Element接口表示一个元素,该接口扩展自Node接口,自然继承了Node接口的属性和方法,也有一套针对元素的属性和方法。 Element接口常见的属性比较少,常用的就是一个只读的tagName属性,该属性返回元素名,数据类型是DOMString。 Element接口定义的方法也主要是针对属性操作,常见方法如下:方法名 数据类型 说明getAttribute DOMString 返回对应属性getAttributeNode Attr 返回对原创 2014-12-10 08:24:35 · 3419 阅读 · 0 评论 -
DOM笔记(二):Node接口
所有的节点都使用Node接口来表示,可以使用很多方法去获取节点,如document.getElementsByTagName()、document.getElementsByName()等均返回一个NodeList对象,然后获取其中的节点。 节点对应的属性和放大均在Node接口予以定义: 1、Node接口常见的属性列表属性名 数据类型 说明nodeName DOMString 返回节点名nodeValue DOMString 返回节点值nodeType int 返回节点类型原创 2014-12-09 09:19:50 · 1285 阅读 · 0 评论 -
DOM笔记(一):HTMLDocument接口
操作HTML文档的第一步就是获取对文档元素的引用,每一个元素在DOM中就是一个节点,所有的元素在DOM中构成一个节点树。用于获取元素节点定义的方法定义于HTMLDocument接口,window.document方法用于实现该接口,其定义的常用方法和属性如下: 属性或方法 返回值类型 说明[getter] 任何类型 根据元素的name属性获取所有元素节点all HTMLAllCollection 文档中所有元素组成的集合,已不推荐使用body HTMLElement 获取<body>元素节点原创 2014-12-08 14:56:22 · 1511 阅读 · 0 评论