jquery在<div>中选择多个<p>答案

【问题标题】：jquery select multiple <p> in <div>jquery在<div>中选择多个<p>
【发布时间】：2011-07-11 15:25:35
【问题描述】：

HTML：

<div id='example'>
  <p> First paragraph</p>
  <p> Second paragraph</p>
  <p> Third paragraph</p>
</div>

带有 JQuery 的 Javascript： var paragraphs = $('div#examples p');

这将返回一个 HTMLParagraphElement 对象数组。但是，我希望返回 Jquery 对象。（这样我就可以使用例如：

for(i=0;i<paragraphs.length;i++)
{
   paragraph[i].hide();
}

有没有办法让我轻松做到这一点？谢谢。

【问题讨论】：

【解决方案1】：

您仍然可以使用您使用的选择器查询。即：

var paragraphs = $('div#examples p');
 paragraphs.hide();

或

 $('div#examples p').hide();

【讨论】：

【解决方案2】：

试试这个……

$('div#examples p').hide();

【讨论】：

【解决方案3】：

这是查询当前问题的 dom 的最高效方式：

$('#examples).find('p').hide();

这只是一些击键，但选择的速度比其他人在此处给出的示例要快得多。原因是它先遍历所有的div，然后找到可能具有给定id的那些，然后遍历找到它们匹配的p标签。

在我的解决方案中，它只找到#examples，然后向下遍历到它的 p 标签。

【讨论】：

【解决方案4】：

示例：

$('#examples p').hide();

div 不是必须的

【讨论】：

【解决方案5】：

从您的问题的外观来看，正如其他人所说，答案将是：

$('div#examples p').hide();

但是对于必须遍历从 jQuery 查询返回的每个对象的情况，您应该使用以下语法：

$('div#examples p').each(function(){
    $(this).hide();
});

但请记住，如果它像 hide 一样简单，那么只需使用第一个示例。第二个例子是当应用的功能特定于每个对象时。下一个示例是将所有返回的对象的高度加倍，这不能以与第一个示例相同的方式完成：

$('div#examples p').each(function(){
    var h = $(this).height();
    $(this).height(h * 2);
});

【讨论】：

【解决方案6】：

感谢大家的意见。 div p 数组的迭代是必要的（对不起，如果不清楚），所以这样做 $('div#example p').hide(); 不是一个合适的解决方案。我最终做了以下事情：

var arr = $('div#example p');

for(i=0;i<arr.length;i++)
{
  $(arr[i]).hide();
}

希望这对未来的人们有用:)

【讨论】：