jQuery如何获取某元素之外的所有同类元素

Question

<ol id="orderedlist2">
<li>First element, second list</li>
<li>Second element, second list</li>
<li>Third element, second list</li>
<li>Li with child ul
<ul>
<li>Child One<a href="#">123</a></li>

<li>child two</li>
</ul>
</li>
</ol>
$(document).ready(function() {
$("li").not("[ul]").css("border","1px solid black");
});如何获取 除了包含 "ul"元素之外的所有 li 元素，上面的写法不出效果。

Answer 1

$("#orderedlist2 > li:not(:has(ul))").css("border","1px solid black");

Answer 2

 $("#orderedlist2").children().css("border","1px solid black");

Answer 3

这种写法不是很熟悉。
我根据您的写了个繁琐的
$("li").not($("li").has('ul')).css("border","1px solid black");

Answer 4

$("#orderedlist2 > li:not(:has(ul))").css("border","1px solid black");另外这里的 #orderedlist2 > li  和 #orderedlist2  li 只是写法上的简化吗？

Answer 5

照你的思路可以这样写：
$("#orderedlist2 > li").not(":has(ul)").css("border","1px solid black");

Answer 6

$("ul").siblings("li").css("border","1px solid black");

Answer 7

这两个是完全不同的选择器，#orderedlist2 > li选择的是直接子元素，只选择#orderedlist2下的第一层li元素，后者是父子选择器，会将#orderedlist2元素内所有的li元素全部选择，包括li元素中包含的li子元素。

Answer 8

$("#orderedlist2 > li").not(":has(ul)").css("border","1px solid black");
// 或者
$("#orderedlist2 > li").filter(function(){
return $(this).has("ul").length === 0 ? true : false;
}).css("border","1px solid black");