给出以下
HTML示例…
@H_301_2@<div id='div1'>div one</div>
<div id='div2'>div two</div>
…我发现以下jQuery代码…
@H_301_2@$('#div1').click(function() { var $d = $(this); // Using 'this' instead of '#div1' $d.add('#div2').remove(); }); @H_301_2@$('#div1').click(function() { var $d = $('#div1'); // Using '#div1' instead of 'this' $d.add('#div2').remove(); });…成功添加#div2.
在查询firebug时,我发现使用$(this)给了jQuery对象一个#div1的上下文,但是做$(‘#div1’)给对象一个文档的上下文.
鉴于这些信息我试过…
@H_301_2@var $d = $(this,document);…和add()函数按预期工作.
所以这里的问题.有人可以向我解释为什么在使用$(this)vs $(‘#div1’)时分配了不同的上下文？
解决方法
编辑以更好地解决您的问题：
First,look at the relevant code here,这是jQuery如何处理$()调用.当你传递一个DOM元素(这就是它自己的div)时,上下文是DOM元素本身,这样可以更好地处理文档片段等.当你传递一个字符串时,默认上下文是document(因为它是顶级祖先搜索).记住一个$(选择器,上下文)实际上是在封面下调用context.find(selector),所以如果没有指定的话,开始文档是有意义的.
First,look at the relevant code here,这是jQuery如何处理$()调用.当你传递一个DOM元素(这就是它自己的div)时,上下文是DOM元素本身,这样可以更好地处理文档片段等.当你传递一个字符串时,默认上下文是document(因为它是顶级祖先搜索).记住一个$(选择器,上下文)实际上是在封面下调用context.find(selector),所以如果没有指定的话,开始文档是有意义的.
注意：您可以随时检查上下文,它是一个可用的属性,如下所示：$(this).context
对于.add()行为：
.add()使用相同的上下文来选择要添加的jQuery元素,所以你看到的是预期的行为.为了更好的描述,see how .add() is written：
注意如果没有通过,它将如何使用当前上下文.为了覆盖这一点,它接受一个上下文,您可以通过这个上下文传递文档并获得所需的结果,如下所示：
@H_301_2@$('#div1').click(function() { $(this).add('#div2',document).remove(); });