读jQuery之十 事件模块概述

为了叙述每一篇的重点,其示例代码都是最精简的,比如选择器只能传HTMLElement和id. 这篇我们增强下选择器,依据2/8原则,这里仅实现最常用的几种. 1, 通过id获取,该元素是唯一的$('#id') 2, 通过className获取$('.cls') 获取文档中所有className为cls的元素$('.cls', el)$('.cls', '#id')$('span.cls') 获取文档中所有className为cls的span元素$('span.cls', el) 获取指定元素中c

很多同学在项目中都喜欢将数据存储在HTMLElement属性上,如 复制代码 代码如下: <div data="some data">Test</div> <script> div.getAttribute('data'); // some data </script> 给页面中div添加了自定义属性"data"及值"some data".后续JS代码中使用getAttribute获取. jQuer

.remove 所作的事情与上一篇提到的.add 刚好相反.且与.add中的处理代码一一对应,即  .add 中有多少种添加事件的方式.remove就有对应的删除方式. .remove 定义了四个参数 elem, types, handler, pos .从字面上看四个参数的意义很明了 elem 为HTMLElement types 为String类型,事件名称如'click'或'mouseover mouseout' handler 为Function类型,事件回调函数 pos 为Number

jQuery的$调用后想要获取DOM元素可以使用get方法,如下 复制代码 代码如下: // 方式1 $('div').get(1); // 获取页面中第二个div 当然,也可以使用数组索引方式获取 复制代码 代码如下: // 方式2 $('div')[1]; // 获取页面中第二个div 上面两种方式都可以获取某一个特定的DOM元素,而获取DOM元素集合却要使用toArray方法 复制代码 代码如下: $('div').toArray(); // 返回页面中所有的div,依次放入数组中 看看g

这篇看看其源码,这个add定义如下(省略大部分) 复制代码 代码如下: add: function( elem, types, handler, data ) { if ( elem.nodeType === 3 || elem.nodeType === 8 ) { return; } ... } 定义了四个参数elem.types.handler和data分别为HTMLElement.事件类型(如click).事件响应函数.数据.此外,types 可以以空格分开传多种事件("mouseover

对于jQuery的写法甚是困惑,尤其在使用Prototype的$后,一度不能理解jQuery的$.对于现在前端同学来说,可能第一个接触的就是jQuery了,他们会觉得很习惯,很自然. 至今电脑里还存放着当时的API文档,发个图感叹下 在这段时间内,我的入门老师是墨墨,其实至今他仍然是我敬仰的同事之一.他的编程造诣很高,相信早已突破了编程语言的限制.在大家都在使用Prototype.js的时候,在jQuery尚未在国内流行的时候,他就已经把jQuery引入到项目中了. 言归正传吧,目前的jQuer