章节
问答
课签
笔记
评论
占位
占位

jQuery选择器之特殊选择器this

相信很多刚接触jQuery的人,很多都会对$(this)和this的区别模糊不清,那么这两者有什么区别呢?

this是JavaScript中的关键字,指的是当前的上下文对象,简单的说就是方法/属性的所有者

下面例子中,imooc是一个对象,拥有name属性与getName方法,在getName中this指向了所属的对象imooc

var imooc = {
    name:"慕课网",
    getName:function(){
        //this,就是imooc对象
        return this.name;
    }
}
imooc.getName(); //慕课网

当然在JavaScript中this是动态的,也就是说这个上下文对象都是可以被动态改变的(可以通过call,apply等方法),具体的大家可以查阅相关资料

同样的在DOM中this就是指向了这个html元素对象,因为this就是DOM元素本身的一个引用

假如给页面一个P元素绑定一个事件:

p.addEventListener('click',function(){
    //this === p
    //以下两者的修改都是等价的
    this.style.color = "red";
    p.style.color = "red";
},false);

通过addEventListener绑定的事件回调中,this指向的是当前的dom对象,所以再次修改这样对象的样式,只需要通过this获取到引用即可

 this.style.color = "red"

但是这样的操作其实还是很不方便的,这里面就要涉及一大堆的样式兼容,如果通过jQuery处理就会简单多了,我们只需要把this加工成jQuery对象

换成jQuery的做法:

$('p').click(function(){
    //把p元素转化成jQuery的对象
    var $this= $(this) 
    $this.css('color','red')
})

通过把$()方法传入当前的元素对象的引用this,把这个this加工成jQuery对象,我们就可以用jQuery提供的快捷方法直接处理样式了

总体:

this,表示当前的上下文对象是一个html对象,可以调用html对象所拥有的属性和方法。
$(this),代表的上下文对象是一个jquery的上下文对象,可以调用jQuery的方法和属性值。

任务

在代码编辑器中第29行填写相应代码

$(this)
?不会了怎么办
||
1
2
<!DOCTYPE html>
<html>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
提交
重置代码
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

收藏课程后,能更快找到我哦~

使用 Ctrl+D 可将课程添加到书签

邀请您关注公众号
关注后,及时获悉本课程动态

举报

0/150
提交
取消
全部 精华 我要发布

最赞回答 / 酥v哒哒
需要点击,点击事件。

最赞回答 / Sapce
object.addEventListener('event', fun, syn);object: 事件发生源event: 事件,如 load, click, mouseover, mouseout 等fun: 事件发生所要执行的方法,可内联,可外调syn: 异步处理方式,为 true 或 false

已采纳回答 / isSmallFish
$()表示是jqery函数    $this  前面加个$表示jqery对象 $(this) 表示jqery的this函数

最新回答 / Sapce
指定事件处理函数的时期或阶段(boolean)第三个参数设置为true就在捕获过程中执行,反之就在冒泡过程中执行处理函数关于函数处理时期或阶段,建议了解一下 MVC 模型

已采纳回答 / 幕布斯1575531
我把你的代码复制过去,有变啊,你点没有。。。

最赞回答 / 盛小六
你用的是jq的方法,你还没有把p1加工为jq对象,所以没法调用。var p1=$("#test1")

已采纳回答 / 慕神7088389
我可以为什么你不可以,检查下书写看看。

最赞回答 / 慕丝6361662
this是javascript中的对象,$(this)是jQuery中的对象;.css()是jQuery中的方法,只能使用jQuery对象调用

最新回答 / MR帽子先生
就是什么类触发的事件你这个东西this就指向谁,同属一点就是,我撞了你,你的this就是指向我,意思是这个人触发了你。这样解释比较简单,希望能帮到你,祝你学习愉快,还有问题可以继续问我。

已采纳回答 / qq_笑对人生_9
jq引的有问题吧

最赞回答 / 清风流光
你没点呗 要么this 你加引号了

已采纳回答 / Mr丶Jia
点击颜色才会变!

已采纳回答 / qq_似水星源_0
我说一下我的理解,this和$(this)实际指代的都是你当前要操作的p标签,只不过,他们的性质不一样,this实际上是一个HTML的元素,可是$(this)是一个被封装好的jQuery对象,你可以alert一下看看他们都是什么,另外,this你可以直接添加title这样的属性,可是jQuery对象的$(this)你却不能直接添加,可以用attr('title','value')进行操作。
全部 我要发布
最热 最新
只看我的

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

账号登录 验证码登录

遇到问题
忘记密码

代码语言