javascript的this与jQuery的$(this)的比较

javascript的this关键字代表当前DOM元素,$(this)表示对this的引用,也就是对当前DOM元素的引用,其实是一回事。将$(this)转为DOM元素后就是this。也就是说$(this)[0]===this。将jQuery对象转化为对应的DOM元素的内容可以参看本站的《将jQuery对象转为普通DOM元素》

1
2
3
<a id="link1">text1</a>
<a id="link2">text2</a>
<a id="link3">text3</a>
1
2
3
4
5
$('a').mouseenter(
function () {
alert(this.id);
alert($(this).attr('id'));
});

两句代码效果是一样的。

使用$(this)的好处

$(this)是一个jQuery对象集,所以可以使用jQuery函数。
jQuery对象集调用each方法时,当jQuery对象集表示对dom元素的引用时,在函数内使用$(this)代表每一个JQuery对象,其实也是对当前DOM元素的引用而已。

1
2
3
4
5
$('a').each(function(){
// Loop that alerts the id value for every <a> in the page.
alert($(this).html()); // "this" refers to the current element in the loop.
alert(this.innerHTML); // "this" refers to the current element in the loop.
});

会分别打印出每个a标签的文本两次,两句代码效果是一样的。
您可在这里查看和调试以上代码。

© 2022 谈谈IT All Rights Reserved. 本站访客数人次 本站总访问量
Theme by hiero