使用jQuery在上下文中查找项目

我在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

li存在:1、21
找到ul 1:0
找到ul 2:0
儿童ul 1:3
儿童ul 2:3
过滤器ul 1:0
过滤器ul 2:0
li li11:错误-错误
li li12:错误-错误
li li13:错误-错误
li li21:错误-正确
li li22:错误-错误
li li23:错误-错误
儿童II ul 1:错误-错误
儿童II ul 1:错误-错误
儿童II ul 1:错误-错误
儿童II ul 2:错误-正确
儿童II ul 2:错误-错误
儿童II ul 2:错误-错误
查找II ul 1:错误-错误
查找II ul 1:错误-错误
查找II ul 1:错误-错误
find II ul 2:错误-正确
查找II ul 2:错误-错误
查找II ul 2:错误-错误
‘SOLUTION’:::最接近的li-&ul; ul:ul2


如何判断元素是否在上下文中(例如在上述情况下),例如“ li”是否在“ ul”中? jQuery使用“ find”之类的方法.

最佳答案
除非可以在选择器中执行此操作,否则我将使用closest()查找父上下文.

$('#li22').closest('ul').length;

或作为插件

$.fn.context = function(context) {
  return !!$(this).closest(context).length;
};

console.log( $('#li22').context('kbd') ); // prints false

相关文章

jQuery插件的种类 1、封装对象方法 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进...
扩展jQuery插件和方法的作用是非常强大的,它可以节省大量开发时间。 入门 编写一个jQuery插件开始于给...
最近项目中需要实现3D图片层叠旋转木马切换的效果,于是用到了jquery.roundabout.js。 兼容性如图: ht...
一、什么是deferred对象? 开发网站的过程中,我们经常遇到某些耗时很长的javascript操作。其中,既有异...
AMD 模块 AMD(异步模块定义,Asynchronous Module Definition)格式总体的目标是为现在的开发者提供一...