Question

<div class='main'>

<div>
        <div>
            <button></button>
        </div>
</div>
<ul>    
        <li>
            <img />
        </li>

        <li>
            <h1></h1>
        </li>

</ul>
<div>
        <span>
            <a href=""></a>
        </span>
</div>

</div>

问题：我想选择按钮，img，h1和a。在jQuery中执行此操作的唯一方法（我知道）是$（。main）.children（）。children（）。children（）。但是有另一种方法可以在jQuery中选择这些元素吗？（不要多次使用孩子（））

Answer 1

jQuery选择器像CSS选择器一样工作：

var $button = $('.main > div > div > button');

您还可以使用find()方法：

var $a = $('.main').find('a');

http://api.jquery.com/category/selectors/

Answer 2

你可以使用.find（）方法：

$('.main').find()

Answer 3

实际上，如果您尝试选择“容器div”中的所有叶节点，可以尝试

$(".main :not(:has(*))")

这将选择“container div”中没有子元素的任何级别的任何元素。

Answer 4

<div class="main">
   <div>
      <div>
         <button class="mustSelect"></button>
      </div>
   </div>
   <ul>
      <li>
         <img class="mustSelect" />
      </li>
      <li>
         <h1 class="mustSelect"></h1>
      </li>
   </ul>
   <div>
      <span>
      <a href="" class="mustSelect"></a>
      </span>
   </div>

将类（class =“mustSelect”）添加到您需要的元素中。然后在js中你可以参考下面这些元素。

$('.mustSelect')

如果 您无法添加课程 ，请使用以下

$("button, img , h1 , a ", ".main")

它告诉jquery选择.main类中的按钮，img，h1，a。

希望这会帮助你。如果您有任何疑问，请随时提出。感谢

jQuery children（）更深入

4 个答案: