Question

如果我这样做

var domElement = $("#id");

，返回的元素是div标签，

我怎样才能做类似

的事情

domElement.$('div a:nth-child(3)').after(somehtml);

这是一个示例，我想在“domElement”div下的第三个链接之后添加一些HTML。

以上似乎不起作用。我有很多例子，我已经从整个页面HTML中选择了某个元素，然后我想在该元素的“上下文”中工作。

在90％的情况下，我想继续jQuery选择，来自页面的先前选择的DOM元素的traversion和操作，而不是像$（..）那样来自整个页面。

Answer 1

您想要.find()：http://api.jquery.com/find/

var domElement = $("#id");
domElement.find('div a:nth-child(3)').after(somehtml);

如果您计划在domElement上使用多个子选择器对其进行链接，请结束.find()与.end()的每次使用：

$("#id")
  .find('div')
    .click(function() { alert("#id div"); })
    .find('a.my-class1')
      .click(function() { alert("#id div a.clickable"); })
      .end() // stop working with 'a.my-class1'
    .find('a.my-class2')
      .click(function() { alert("#id div a.my-class2"); }) 
      .end() // stop working with 'a.my-class2'
    .end() // stop working with 'div'
  .click(function() { alert("#id"); });

从概念上讲，您使用.find（）深入到DOM中，然后使用.end（）升级DOM。从技术上讲，“降序”和“升序”是不正确的，因为您还可以使用.parent()或.closest()之类的函数首先遍历然后向下遍历，这两个函数都可以.end()结束返回原始选择器：

$("#id")
  .parent()
    .click(function() { alert("I'm #id's parent!"); })
    .end()
  .click(function() { alert ("back to #id"); });

Answer 2

两个选项，使用jQuery function的上下文参数：

$('div a:nth-child(3)', domElement).after(something);

或（我的偏好）使用find：

domElement.find('div a:nth-child(3)').after(something);

Answer 3

试试这个：

$('div a:nth-child(3)', domElement).after(somehtml);

Answer 4

尝试

$('div a:nth-child(3)',domElement).after(somehtml);

上下文是第二个参数。

祝你好运。

jQuery上下文选择

4 个答案: