选择一个确切的元素而不是它的子元素

Question

我有这样的菜单;

<ul>
 <li><a>1</a></li> 
 <li><a>2</a>
  <ul>
   <li><a>3</a></li>
   <li><a>4</a></li>
   <li><a>5</a></li>
   <li><a>6</a>
    <ul>
     <li><a>7</a></li>
     <li><a>8</a></li>
     <li><a>9</a></li>
    </ul> 
   </li>
  </ul>
  <li><a>10</li>
</ul>

如果我想用jQuery在二级进行选择.

$('ul li ul li') { action() }

但是当我这样做的时候,这个动作也会被它的孩子们所采用,(ul li li li li li)我不希望这种情况发生.

我只想选择(ul li ul li).

使用jQuery,我如何使它工作？

Answer 1

解决此问题的最简单方法是为外部<ul>提供CSS类标识符或id.然后使用直接后代选择器

$('ul.className > li > ul > li') // CSS class className

要么

$('#id > li > ul > li') // id id