如何用一个选择器选择一个jQuery元素的子元素？

Question

我有一个div id article_50。 如果我要在.title中选择article_50元素，我可以执行以下操作： $("#article_50 .title")。

现在说我想选择相同的标题，但在点击事件中：

$("#article_50").click(function(){
    $(this).children(".title").hide();
});

现在我必须调用children方法来选择.title元素。 我可以在同一选择器中选择它而无需调用children吗？

这样的事情：

$("this .title").hide();

谢谢！

Answer 1

几乎就在那里：

$(".title", this).hide();

Answer 2

$("#article_50").click(function(){ $(".title", this).hide(); });

Answer 3

如果.children()元素实际上是.title的孩子，请使用this。

当你这样做时：

$(".title", this).hide();

... jQuery必须运行7或8个测试才能确定您在.title内找到this。

然后jQuery就把它翻到了这个：

$(this).find('.title')

......然后重新开始。因此，在所有测试之后，无论如何都要调用一个方法。正如你所看到的那样效率不高。

此外，由于.children()只有一个级别，如果您的元素实际上是孩子，则使用.children()比.find()更快。

---

修改

更快的方法是将#article_50元素缓存在变量中，因此每次单击时都不需要为$(this)创建jQuery对象。

var $art_50 = $("#article_50").click(function(){
    $art_50.children(".title").hide();
});

// Now you have a variable that you can use outside the click handler as well
//   in case you are selecting it elsewhere in your code.

Answer 4

你不应该只能说：

$("#article_50").click(function(){ $("#article_50 .title").hide(); });

这几乎是一样的，你不需要打电话给孩子。