开发者

jquery find index() of same node name

I have this setup, just to find the index() of an element, but it should look at elements of the same level with the same nodename.

The retur开发者_如何学运维ning numbers are not as expected. See the code comment. I want filteredByNodeNameIndex to be '2'.

Hope this example code is clear enough:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    <title>TestDrive</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
    <script type="text/javascript" >
        function TestDrive()
        {
            var $obj = $("#div2");
            console.log("$obj.length:" + $obj.length); // returns: 1

            var $filtered = $obj.parent().children($obj[0].nodeName); // find all divs in same parent
            console.log("$filtered.length:" + $filtered.length); // returns: 3 

            var $obj_clone = $filtered.find($obj); // find original element again. Is something wrong here? 
            console.log("$objAgain.length:" + $obj_clone.length); // returns: 0

            var filteredByNodeNameIndex = $obj_clone.index(); // i want the number 2 here
            console.log("filteredByNodeNameIndex:" + filteredByNodeNameIndex); // returns: -1
        }
    </script>
</head>
<body onload="new TestDrive()">
    <div id="container"> 
        <!-- some random elements just for test -->
        <a></a>
        <div id='div1'></div>
        <div id='div2'></div>
        <span></span>
        <span></span>
        <a></a>
        <div></div>
        <a></a>
    </div>
</body>
</html>

Who can spot where this is wrong?


Try using .filter instead of .find:

var $obj_clone = $filtered.filter($obj);

The problem with .find is that it looks for children of the matched element, not siblings. From the docs:

Get the descendants of each element in the current set of matched elements, filtered by a selector, jQuery object, or element.

Compared to .filter:

Reduce the set of matched elements to those that match the selector or pass the function's test.


find only searches children of the selected node. You are trying to use filter's functionality. You need the following:

        var $obj_clone = $filtered.filter($obj); // find original element again. Is something wrong here? 


At the third attempt, you're trying to find the the child in itself, which obviously doesn't return the desired value.

Illustrated:

 var $filtered = $obj.parent().children($obj[0].nodeName);
 //Select set A

 var $obj_clone = $filtered.find($obj);
 //Search for set A among the CHILDREN of set A --> Fails, obviously?

 var filteredByNodeNameIndex = $obj_clone.index();
 //Unexpected results.


try:

var $obj_clone = $filtered.filter($obj);

.find() only looks for children

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜