有什么区别吗
$('input.current_title', '#storePreferences').prop('disabled', false);
和
$('#storePreferences input.current_title').prop('disabled', false);
?
有什么区别吗
$('input.current_title', '#storePreferences').prop('disabled', false);
和
$('#storePreferences input.current_title').prop('disabled', false);
?
有区别,它并不像其他人认为的那样微妙。
编辑:外行的例子:
让我们分解一下它选择的内容。
首先我们有:上下文选择器 http://api.jquery.com/jQuery/#jQuery-selector-context
$('input.current_title', '#storePreferences').prop('disabled', false);
这表示:在上下文中使用选择器。 http://api.jquery.com/jQuery/#jQuery-selector-context
虽然这种形式可能有效,但它真的应该是:
$('input.current_title', $('#storePreferences')).prop('disabled', false);
或者
var myContext = $('#storePreferences');
$('input.current_title', myContext).prop('disabled', false);
这满足了满足上下文选择器的要求:“用作上下文的 DOM 元素、文档或 jQuery”。
这说:使用上下文,在里面找到选择器。一个等价的将是:
$('#storePreferences').find('input.current_title').prop('disabled', false);
这就是内部发生的事情。查找'#storePreferences'
并在其中找到所有'input.current_title'
匹配的元素。
然后我们有:后代选择器
$('#storePreferences input.current_title').prop('disabled', false);
这是一个后代选择器(“祖先后代”)http://api.jquery.com/descendant-selector/它说:找到input.current_title
元素内的所有#storePreferences
元素。这就是棘手的地方!- 这正是它的作用 -
找到 ALL the input.current_title
(anywhere),然后找到那些 INSIDE the #storePreferences
element。
因此,我们遇到了 jQuery 的 Sizzle 从右到左选择器 - 所以它最初发现(可能)比它需要的更多,这可能是一个性能问题/问题。
因此形式为:
$('#storePreferences').find('input.current_title').prop('disabled', false);
最有可能比 Descendant 版本表现更好。
有什么区别
$('input.current_title', '#storePreferences').prop('disabled', false);
和$('#storePreferences input.current_title').prop('disabled', false);
?
不同之处在于如何选择元素。
$('input.current_title', '#storePreferences');
相当于1:
$('#storePreferences').find('input.current_title');
但不等同于:
$('#storePreferences input.current_title');
即使相同的元素会受到影响。
它们不同的原因是 usingfind
允许#storePreferences
在end
调用时返回上下文。
// 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 );
}
在您的问题的上下文中,将修改相同的元素,因此功能上没有区别,但重要的是要了解您使用的选择器的更广泛含义。
在您的示例中,我认为几乎没有区别。
当您开始选择特定 DOM 元素中的多个元素时,它会得到更好的使用。
// Get the div in the body with the id of storePreferences
var sp = $('body div#storePreferences');
// jQquery will only look for **input.current_title** **input.name** **input.age** in side **sp** div in the DOM.
// Faster
$('input.current_title', sp).prop('disabled', false);
$('input.name', sp).prop('disabled', false);
$('input.age', sp).prop('disabled', false);
// jQquery will look for **input.current_title** in entire DOM
// Slower
$('#storePreferences input.current_title').prop('disabled', false);