Question

以下代码来自timers jQuery插件演示。我不明白第2行的选择器中发生了什么。它似乎是在选择p元素，但是逗号之后的第二个参数是什么 - demos - 那里有？

jQuery的：

var demos = $("div.wrapper div.demos");             
$(".uncontrolled-interval p", demos).everyTime(1000,function(i) {
                    $(this).html(i);
                });

HTML：

<div class="wrapper"> 
    <div class="demos">         
        <div class="uncontrolled-interval"> 
            <p>I am transient... *sigh*</p> 
        </div>      
    </div> 
</div>

由于

Answer 1

它指定搜索的上下文。基本上是过滤器。

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

因此，在此示例中，它会在demos元素中搜索.uncontrolled-interval p。如果您有此标记，它仍然只会选择demos中的标记。

<div class="wrapper">          
    <div class="uncontrolled-interval"> 
        <p>I am transient... *sigh*</p> //Will not select
    </div>     
    <div class="demos">         
        <div class="uncontrolled-interval"> 
            <p>I am transient... *sigh*</p> //Will select
        </div>      
    </div> 
</div>

Answer 2

使用jQuery函数（或其别名$）选择带有jQuery的元素时，您可以提供上下文以及here所述的选择器。

说的是：在给定的上下文中选择与提供的CSS 选择器匹配的每个元素， context 表示该区域的您已经选择的DOM。

换句话说，它说：使用 context 作为被搜索的DOM树的根，而不是文档根。

Answer 3

除了其他答案外，上下文的作用类似于.find()：

在内部，选择器上下文是用.find（）方法实现，所以$（'span'，this）相当于 $（本）.find（ '跨度'）。

Personnaly，我更喜欢将demos.find(".uncontrolled-interval p")写为$(".uncontrolled-interval p", demos)

帮助理解jQuery选择器示例

3 个答案: