读jQuery之九 一些瑕疵说明

1,bind 方法,最后一个参数fn是多余的


代码如下:

// Handle object literals
if ( typeof type === "object" ) {
for ( var key in type ) {
this[ name ](key, data, type[key], fn);
}
return this;
}

2,注释


代码如下:

// Add which for click: 1 === left; 2 === middle; 3 === right

应修改为


代码如下:

// Add which for mousedown/mouseup : 1 === left; 2 === middle; 3 === right

3,data方法,定义了局部变量internalKey,但后续代码仍然沿用jQuery.expando。


代码如下:

var internalKey = jQuery.expando, getByName = typeof name === "string", thisCache,

4,jQuery.event.add方法,arguments改为e,apply改为call 更好一些。因为只会传一个参数:事件对象。


代码如下:

elemData.handle = eventHandle = function( e ) {
// Discard the second event of a jQuery.event.trigger() and
// when an event is called after a page has unloaded
return typeof jQuery !== "undefined" && (!e || jQuery.event.triggered !== e.type) ?
jQuery.event.handle.apply( eventHandle.elem, arguments ) :
undefined;

};

5,基于 “勿重复检测浏览器” 原则,jQuery.event.add 以下代码


代码如下:

if ( elem.addEventListener ) {
elem.addEventListener( type, eventHandle, false );

} else if ( elem.attachEvent ) {
elem.attachEvent( "on" + type, eventHandle );
}

应该使用以下来替换


代码如下:

jQuery.addEvent = document.addEventListener ?
function( elem, type, handle ) {
if ( elem.addEventListener ) {
elem.addEventListener( type, handle, false );
}
} :
function( elem, type, handle ) {
if ( elem.attactEvent ) {
elem.attactEvent( "on" + type, handle );
}
};

事实上,jQuery中已经有了jQuery.removeEvent,却不知为何没有jQuery.addEvent。

(0)

相关推荐

  • 读jQuery之四(优雅的迭代)

    jQuery的操作往往是分两步 1,获取元素集合(选择器) 2,操作元素集合 而第二步操作元素集合的主要方法就是jQuery.each.查看源码,我们发现jQuery.each及this.each分别调用了27次和31次.可见它是多么的重要. 这篇将分析下jQuery.each及this.each方法.看看他们如何与jQuery.extend一起扩展jQuery库.最后我会给zChain.js加上each方法. 部分源码如下 复制代码 代码如下: jQuery.fn = jQuery.proto

  • 读jQuery之五(取DOM元素)

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

  • 读jQuery之一(对象的组成)

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

  • 读jQuery之十一 添加事件核心方法

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

  • 读jQuery之七 判断点击了鼠标哪个键的代码

    jQuery丢弃了标准的 button 属性采用 which,这有点让人费解. which 是Firefox引入的,IE不支持.which的本意是获取键盘的键值(keyCode). jQuery中的which即可以是键盘的键值,也可以是鼠标的键值.即当判断用户按下键盘的哪个键时可以使用which,当判断用户按下鼠标的哪个键时也可以用which.它一举两用了.源码 复制代码 代码如下: // Add which for key events if ( event.which == null &&am

  • 读jQuery之十二 删除事件核心方法

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

  • 读jQuery之十 事件模块概述

    后面会详细分析jQuery.event.add/jQuery.event.remove/jQuery.event.trigger. 虽然事件模块代码很难读,但其提供的API接口还是很清晰的.如下 1 添加事件(bind/one/live/delegate/hover/toggle) bind 基本的添加事件函数. one 添加只执行一次的事件函数. live 事件代理(使用document代理). delegate 事件代理(使用指定元素代理). hover 模拟css的hover. toggl

  • 读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

  • 读jQuery之二(两种扩展)

    如下 复制代码 代码如下: jQuery.extend = jQuery.fn.extend = function() { ... }; 我们可以用$.extend去扩展自定义的对象,如 复制代码 代码如下: var myself = {name:jack}; $.extend(myself, {setName: function(n){this.name=n;} }); myself.setName("tom"); 通过$.extend为对象myself添加了setName方法.但这

  • 读jQuery之六 缓存数据功能介绍

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

  • 读jQuery之八 包装事件对象

    比如,停止事件冒泡IE用 cancelBubble ,标准浏览器则用 stopPropagation . 获取事件源对象,IE用 srcElement ,标准浏览器则用 target 诸如此类. jQuery 对原生事件对象的修复和包装主要使用 jQuery.Event 类和 jQuery.event.fix 方法. 复制代码 代码如下: jQuery.Event = function( src ) { // Allow instantiation without the 'new' keywo

随机推荐