我在 JS 到 jQuery 中有这段代码:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<title>test</title>
</head>
<body>
<ul id="ul1">
<li id="li11">11</li>
<li id="li12">12</li>
<li id="li13">13</li>
</ul>
<ul id="ul2">
<li id="li21">21</li>
<li id="li22">22</li>
<li id="li23">23</li>
</ul>
<pre id="result"></pre>
</body>
</html>
<script>
$(function(){
var liFind = $("#li21");
var liFindDoc = document.getElementById("li21");
var ul1 = $("#ul1");
var ul2 = $("#ul2");
$("#result").append( "li exist: "+$(liFind).length+", "+$(liFind).html()+"<br />");
$("#result").append( "find ul 1 : "+$(ul1).find(liFind).length+"<br />");
$("#result").append( "find ul 2 : "+$(ul2).find(liFind).length+"<br />");
$("#result").append( "children ul 1 : "+$(ul1).children(liFind).length+"<br />");
$("#result").append( "children ul 2 : "+$(ul2).children(liFind).length+"<br />");
$("#result").append( "filter ul 1 : "+$(ul1).filter(liFind).length+"<br />");
$("#result").append( "filter ul 2 : "+$(ul2).filter(liFind).length+"<br />");
$("li").each(function(i,val){
$("#result").append("li "+$(val).attr("id")+": "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul1).children().each(function(i,val){
$("#result").append("children II ul 1 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul2).children().each(function(i,val){
$("#result").append("children II ul 2 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul1).find("li").each(function(i,val){
$("#result").append("find II ul 1 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$(ul2).find("li").each(function(i,val){
$("#result").append("find II ul 2 : "+(liFind==val)+" - "+(liFindDoc==val)+"<br />");
});
$("#result").append("'SOLUTION' ::: closest li->ul: "+ $(liFind).closest('ul').attr("id") +"<br />");
});
</script>
并得到这个结果:
- 11
- 12
- 13
- 21
- 22
- 23
存在:1, 21
查找 ul 1 : 0
查找 ul 2 : 0
child ul 1 : 3
child ul 2 : 3
过滤 ul 1 : 0
过滤器 ul 2 : 0
li li11: 假 - 假
li li12: false - false
li li13: 假 - 假
li li21: false - true
li li22: false - false
li li23: 假 - 假
child II ul 1 : false - false
child II ul 1 : false - false
child II ul 1 : false - false
child II ul 2:假 - 真
child II ul 2 : false - false
child II ul 2 : false - false
找到 II ul 1 : false - false
找到 II ul 1 : false - false
找到 II ul 1 : false - false
查找 II ul 2:假 - 真
找到 II ul 2 : false - false
找到 II ul 2 : false - false
'解决方案'::: 最接近的 li->ul: ul2
问题 如何判断一个元素是否在上下文中，例如在上面的情况下，“li”是否在“ul”中？使用 jQuery 使用“查找”等方法。
最佳答案
选择器的第二个参数是为上下文保留的:
$("ul", "body").length; // how many UL's are within the body?
当然，这比仅仅制作更详细的选择器更复杂:
$("body ul").length; // how many UL's are within the body?
此外，您可以随时向家长询问:
$("ul").parents("body").length; // is a BODY up there?
使用“find”可以像这样:
$("ul").find("li").length; // how many LI's (included grandchildren) within UL?
关于jquery - 使用 jQuery 在上下文中查找项目，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/2058629/