Question

我知道这不是代码问题相关的问题，但它是我喜欢知道的东西，它可以帮助其他人：

使用它之间的区别是什么：

$(function() {
    var $fullArea = $('#full-sized-area');
    var $fullContent = $('#full-sized-content', $fullArea);
});

过来说：

$(function() {
    var $fullArea = $('#full-sized-area');
    var $fullContent = $('#full-sized-content, #full-sized-area');
});

Answer 1

两者都很不一样。

基本上您在以下行中使用Multiple Selector (“selector1, selector2, selectorN”)。所以很简单

$('#full-sized-content, #full-sized-area')

如果您正在使用基于上下文的选择器，那么您在full-sized-content

的子项中选择ID为$fullArea的元素

var $fullContent = $('#full-sized-content', $fullArea);

相当于

var $fullContent = $('#full-sized-area').find('#full-sized-content');

注意由于ID必须在HTML中唯一，您只需使用

即可

var $fullContent = $('#full-sized-content');

Answer 2

有区别，

<强> Demo : Multiple selector

var $fullContent = $('#full-sized-content, #full-sized-area');

选择这两个元素 - Multiple selector ：$('#elem1,#elem2,...')

<强> Demo: Parent-child

var $fullContent = $('#full-sized-content', $fullArea);

在这种情况下：#full-sized-content必须是#full-sized-area

的孩子

所以它相当于

$('#full-sized-area #full-sized-content');
          Parent          Child

Answer 3

两者在这里都不同......

$(function() {
    var $fullArea = $('#full-sized-area');
    var $fullContent = $('#full-sized-content', $fullArea);
});

这个在＃full-sized-area元素下具有id“full-sized-content”的select元素

$(function() {
    var $fullArea = $('#full-sized-area');
    var $fullContent = $('#full-sized-content, #full-sized-area');
});

这个选择具有ID全尺寸内容和全尺寸区域

的元素

Answer 4

var $fullContent = $('#full-sized-content', $fullArea);

以上实际上是基于上下文的选择器。那么，简单的做法是： -

$fullArea                           // get the fullArea element
    .find('#full-sized-content')    // find all the descendants with this id inside it

虽然下面的代码表示：

// Get both the elements with id full-sized-content & full-sized-area
var $fullContent = $('#full-sized-content, #full-sized-area');

它就像一个组合选择器。所以，如果您为第一个代码执行以下操作： -

$fullContent.css('color', 'red');

它只会使#full-sized-content内的元素$fullArea的颜色变为红色然而，如果您对第二部分使用相同的代码，它将为full-sized-content＆amp; full-sized-area元素。

FIDDLE DEMO

Answer 5

您的代码：

var $fullContent = $('#full-sized-content', $fullArea);

它说在#full-sized-content中找到$fullArea，因为,。 ,为此创建了一个上下文。

此代码：

var $fullContent = $('#full-sized-content, #full-sized-area');

通常被称为多个选择器选择，这是一个字符串，其中,分隔的元素在

下面

var $fullContent = $('#full-sized-content', $fullArea);

通常会在给定的上下文中找到一个元素,分隔的元素。

多个元素的jQuery选择器

5 个答案: