什么是jQueryselect器中的“上下文”？

有什么区别吗？

$('input.current_title', '#storePreferences').prop('disabled', false); 

和

 $('#storePreferences input.current_title').prop('disabled', false); 

？

Answer 1

有一个区别，并不像其他人所认为的那样微妙。

编辑： Layman的每个例子：

• 打电话给镇上的所有蓝房子，如果简在那里，就摘下她的帽子。
• 打电话给镇上的所有build筑物（没有语境）。 如果它是一个蓝色的房子（添加上下文），简在那里，请摘下她的帽子。

让我们来分解它所select的东西。

首先我们有：上下文select器 http://api.jquery.com/jQuery/#jQuery-selector-context

 $('input.current_title', '#storePreferences').prop('disabled', false); 

这就是说：在上下文中使用select器。 http://api.jquery.com/jQuery/#jQuery-selector-context

虽然这种forms的工作很可能，但实际上应该是：

 $('input.current_title', $('#storePreferences')).prop('disabled', false); 

要么

 var myContext = $('#storePreferences'); $('input.current_title', myContext).prop('disabled', false); 

这符合满足上下文select器的要求：“用作上下文的DOM元素，文档或jQuery”。

这说：使用上下文，find里面的select器。 相当于：

 $('#storePreferences').find('input.current_title').prop('disabled', false); 

这是内部发生的事情。 find'#storePreferences'并find所有的'input.current_title'匹配元素。

---

那么我们有：Descendant Selector

 $('#storePreferences input.current_title').prop('disabled', false); 

这是后代select器（“祖先后代”） http://api.jquery.com/descendant-selector/其中说：findinput.current_title元素内的所有#storePreferences元素。 这是一个很棘手的地方！ – 这就是它所做的 –

find所有的input.current_title （任何地方），然后find#storePreferences元素的内部 。

因此，我们碰到了jQuerys的Sizzle从右到左的select器 – 所以它最初发现更多（可能）比它需要可能是一个性能问题/问题。

因此forms如下：

 $('#storePreferences').find('input.current_title').prop('disabled', false); 

将最有可能比后代版本performance更好。

Answer 2

$('input.current_title', '#storePreferences').prop('disabled', false);有什么区别$('input.current_title', '#storePreferences').prop('disabled', false); 和$('#storePreferences input.current_title').prop('disabled', false); ？

是的，但是很微妙

不同之处在于如何select元素。

 $('input.current_title', '#storePreferences'); 

相当于¹ ：

 $('#storePreferences').find('input.current_title'); 

但不等同于：

 $('#storePreferences input.current_title'); 

即使相同的元素会受到影响。

他们之所以不一样的原因在于，使用find可以在调用#storePreferences时将上下文返回到#storePreferences 。

_{1：jQuery v1.9.1源代码中的194-202行}

 // HANDLE: $(expr, $(...)) } else if ( !context || context.jquery ) { return ( context || rootjQuery ).find( selector ); // HANDLE: $(expr, context) // (which is just equivalent to: $(context).find(expr) } else { return this.constructor( context ).find( selector ); } 

---

在你的问题的背景下，相同的元素将被修改，所以在function上没有区别，但重要的是要意识到你使用的select器的更广泛的含义。