博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery 特殊选择器this
阅读量:6314 次
发布时间:2019-06-22

本文共 1238 字,大约阅读时间需要 4 分钟。

特殊选择器this

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

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

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

var MKing = {    name:"sMKing",    getName:function(){        //this,就是MKing对象        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的方法和属性值。 $this只是个自定义的变量,$(this)是将当前DOM对象转换成jquery对象 addEventListener一共有三个参数(event, function, useCapture),最后一个参数默认是false,表示事件句柄在冒泡阶段执行,true表示在捕获阶段执行。

转载于:https://www.cnblogs.com/sMKing/p/5807493.html

你可能感兴趣的文章
SLAM数据集
查看>>
c#学习笔记05——数组&集合
查看>>
【图论算法】Dijstra&BFS
查看>>
注册和上传文件(头像)
查看>>
使用OVS
查看>>
键盘回收的几种方法
查看>>
Python(条件判断和循环)
查看>>
day4 linux安装python
查看>>
LeetCode Container With Most Water (Two Pointers)
查看>>
vue (v-if show 问题)
查看>>
https基础
查看>>
css3 canvas之刮刮卡效果
查看>>
并查集模板
查看>>
RESTful Mongodb
查看>>
BZOJ3237:[AHOI2013]连通图(线段树分治,并查集)
查看>>
如何提高Ajax性能
查看>>
Android--自定义加载框
查看>>
LINUX下 lamp安装及配置
查看>>
BZOJ3105 [cqoi2013]新Nim游戏
查看>>
困惑的前置操作与后置操作
查看>>