3

我已经看到了 $(this) 的使用并在函数中有所了解,但也曾在选择器中看到过,但无法理解它何时或是否有价值。这是我可以使用并开始工作的两个示例,但是我真的在做任何有价值的事情吗...

在这里,我在选择器中添加了 $(this)

(function($) {
    $(".deliver").on('mouseenter',function(){
        $(this).css({'width':'600px'});
        $(".form_jquery",$(this)).fadeIn(1000).css({'display':'block'});
        $(".componentheading",$(this)).css({'display':'none'});
    }); ...

这是我的原始脚本

(function($) {
    $(".deliver").on('mouseenter',function(){
        $(this).css({'width':'600px'});
        $(".form_jquery").fadeIn(1000).css({'display':'block'});
        $(".componentheading").css({'display':'none'});
    });

我在两者中都保留了我所知道的 (this) 的标准用法,并指出我在匿名函数中使用以防万一。

4

3 回答 3

5
$(".componentheading",$(this))

仅搜索.componentheading当前元素下的$(this)元素(在这种特殊情况下,它是.deliver您输入鼠标的元素)而

$(".componentheading")

在整个文档中搜索它们。

http://api.jquery.com/jQuery/#jQuery1

于 2013-02-12T20:07:44.920 回答
0

为 jQuery 函数提供第二个参数可以缩小选择的范围。默认情况下,上下文是整个文档。

$(this)用作上下文的情况下,您只需要在触发处理程序的元素form_jquery查找具有或componentheading类的元素。mouseenter

提供一个上下文来缩小选择器搜索范围是提高选择器性能的好方法,只要您知道您正在寻找的元素确实可以在该上下文中找到。

于 2013-02-12T20:10:30.547 回答
0
$( selector, context )

jQuery 的实际功能如下所示jQuery( selector, context ),如果您为上下文值提供一个元素,当 jQuery 尝试访问jQuery.find您的元素时,它将从您提供的元素开始。

在许多情况下,这可以提高性能!

阅读有关 jQuery 上下文的信息

为了向 jQuery 函数提供元素,很多人使用一种称为DOM 缓存的方法,您将元素存储在变量中并将其作为引用上下文传递给 jQuery 函数。

于 2013-02-12T20:12:20.073 回答