网上有很多关于jQuery的this和$(this)的介绍,大多数只是理清了this和$(this)的指向,其实它是有应用场所的,不能一概而论在jQuery调用成员函数时,this就是指向dom对象。

$(this)指向jQuery对象是无可厚非的,但this就是指向dom对象,这个是因为jQuery做了特殊的处理。 

在创建dom的jQuery对象时,jQuery不仅仅为dom创建一个jQuery对象,而且还将dom存储在所创建对象的数组中。

  elem = document.getElementById(match[2]);
if (elem && elem.parentNode) {
this.length = 1;
this[0] = elem;
} this.context = document;
this.selector = selector;
return this;

this[0] = elem这条语句就是实现对象数组。所以javascript是很有意思的语言,使用this访问时,可以访问它所指向的对象的成员函数,而其实this又是一个对象数组。其存放的是dom对象。

先看看 $("p").each() -- 循环

each: function( callback, args ) {
return jQuery.each( this, callback, args );
}

看了each函数的调用大家应该明白,jQuery.each( this, callback, args );调用的是对象数组,而对象的数组存储的是dom对象,因此在callback函数中的this自然是dom对象了

再看看$("p").hide() -- 成员函数

hide: function() {
return showHide( this );
},
 function showHide( elements, show ) {var elem, display,
values = [],
index = 0,
length = elements.length; for ( ; index < length; index++ ) {
elem = elements[ index ];
if ( !elem.style ) {
continue;
}
values[ index ] = jQuery._data( elem, "olddisplay" );
if ( show ) {
// Reset the inline display of this element to learn if it is
// being hidden by cascaded rules or not
if ( !values[ index ] && elem.style.display === "none" ) {
elem.style.display = "";
} // Set elements which have been overridden with display: none
// in a stylesheet to whatever the default browser style is
// for such an element
if ( elem.style.display === "" && isHidden( elem ) ) {
values[ index ] = jQuery._data( elem, "olddisplay", css_defaultDisplay(elem.nodeName) );
}
} else {
display = curCSS( elem, "display" ); if ( !values[ index ] && display !== "none" ) {
jQuery._data( elem, "olddisplay", display );
}
}
} // Set the display of most of the elements in a second loop
// to avoid the constant reflow
for ( index = 0; index < length; index++ ) {
elem = elements[ index ];
if ( !elem.style ) {
continue;
}
if ( !show || elem.style.display === "none" || elem.style.display === "" ) {
elem.style.display = show ? values[ index ] || "" : "none";
}
} return elements;
}

从上面的代码可以看出hide行数其实调用的是showHide,而传入的第一个参数this,并不是dom对象,而是jQuery对象数组,因此showHide函数通过循环此对象数组获取每一个dom对象。

最后看看$("p").bind() -- 事件

bind: function( types, data, fn ) {
return this.on( types, null, data, fn );
}, on: function( types, selector, data, fn, /*INTERNAL*/ one ) {
// 此部分代码省略
return this.each( function() {
jQuery.event.add( this, types, fn, data, selector );
});
},

bind函数调用的是 on函数,而on函数又是通过 each函数实现了jQuery.event.add。因此 jQuery.event.add( this中的this也就是dom对象了。所以事件中的this也就是dom对象了。

JQ里的this与$(this)的更多相关文章

  1. jq里attr和prop的区别

    jquery中attr和prop的区别   在高版本的jquery引入prop方法后,什么时候该用prop?什么时候用attr?它们两个之间有什么区别?这些问题就出现了. 关于它们两个的区别,网上的答 ...

  2. jq里验证插件的自定义方法Jquery.validator.addMethod()示例

    最近写验证的时候感觉原生的验证谢了一遍又一遍,就想到了“不要重复造轮子,学会管理自己的工具库”这句名言,于是尝试用jq的validator. 用过又发现需要自定义方法去验证,于是去查官网,写了Jque ...

  3. jq里延迟对象Deferred,状态变化后,会一直保持

    var defer = $.Deferred(); defer.resolve('abc'); defer.done(function (data) { console.log(data); }) d ...

  4. 模仿jq里的选择器和color样式

    (function(){ HTMLElement.prototype.css = function () { var option; if (arguments.length > 0) { op ...

  5. jq仿淘宝放大镜插件

    html部分 //小图 <div id="photoBox"> <img src="图片路径" width="400" h ...

  6. JQ对象到底是什么

    jQuery对象是什么,举个例子,$('#id') 返回的就是jQuery对象,这个东西是整个jQuery的核心所在,所以我先来分析它. var jQuery = function( selector ...

  7. JQ的基本架构

    Jquery的基本架构   引入  以前学习原生JS然后切换到用JQ的时候总觉得很不习惯,甚至有点排斥用JQ.后来自己写项目一直到公司实习用JQ的这段时间,才深深感受到JQ的强大~JQ不仅做到兼容很多 ...

  8. ASP.NET动态网站制作(12)-- JQ(4)

    前言:这节课接着上次课的继续讲. 内容:接上--> 1.jq元素样式设置:  (4)某个元素中是否含有某个css类别,返回布尔型:$("li:last").hasClass( ...

  9. kubernetes集群管理之通过jq来截取属性

    系列目录 首先要声明,这里的jq并不是批前端框架里的jquery,而是一个处理json的命令行工具. jq工具相比yq,它更加成熟,功能也更加强大,主要表现在以下几个方面 支持递归查找(我点对我们平时 ...

随机推荐

  1. 【mybatis】mybatis中insert操作,返回自增id

    需求是这样的: mybatis中insert操作,返回自增id,因为这个自增id需要给后续业务用到. 原本是这样的: 将insert语句传入,正常执行insert操作,返回int永远是 0[失败] 或 ...

  2. 1、CRM2011编程实战——清空指定页签以下的全部选项,并对页签以下的指定控件进行操作

    需求:当页面载入时,"呼叫编号"保持不变,"任务号"自己主动更新."接报时间"和"发生日期"自己主动设置为当天日期和时间 ...

  3. Linux基础(2)- 用户、群组和权限

    一.用户.群组和权限 1)  新建用户natasha,uid为1100,gid为555,备注信息为“master” 2)  修改natasha用户的家目录为/Natasha 3)  查看用户信息配置文 ...

  4. java监听器演示样例

    监听器的原理是观察者模式.就像明星(事件源)聚拢了一群粉丝(观察者).当明星有啥举动的时候会通过粉丝们报道出去. 订阅信息.计算器button都是该原理的应用. 以下写了一个监听器的小样例: pack ...

  5. *Android 多线程下载 仿下载助手(改进版)

    首先声明一点: 这里的多线程下载 并非指的 多个线程下载一个 文件.而是 每一个线程 负责一个文件. 真正的多线程 希望后面能给大家带来.  -------------  欢迎 爱学习的小伙伴 加群 ...

  6. javascript 返回上一页面

    <a href="<a href="javascript :history.back(-1)">返回上一页</a>或<a href=& ...

  7. IGP和EGP(转载)

    AS(自治系统) - 也称为路由域,是指一个共同管理区域内的一组路由器.例如公司的内部网络和 Internet 服务提供商的网络.由于 Internet 基于自治系统,因此既需要使用内部路由协议,也需 ...

  8. VC ++6.0英文版常用菜单使用参考【转载整理】

    (1)File菜单 New:打开“new”对话框,以便创建新的文件.工程或工作区. Close Workspace:关闭与工作区相关的所有窗口. Exit:退出VC6环境,将提示保存窗口内容等. (2 ...

  9. 【BZOJ1042】[HAOI2008]硬币购物 容斥

    [BZOJ10492][HAOI2008]硬币购物 Description 硬币购物一共有4种硬币.面值分别为c1,c2,c3,c4.某人去商店买东西,去了tot次.每次带di枚ci硬币,买si的价值 ...

  10. 九度OJ 1134:密码翻译 (翻译)

    时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:1988 解决:810 题目描述: 在情报传递过程中,为了防止情报被截获,往往需要对情报用一定的方式加密,简单的加密算法虽然不足以完全避免情报 ...