我有这个设置,只是为了找到一个元素的index(),但它应该查看具有相同节点名的相同级别的元素。
返回的数字不符合预期。查看代码注释。我希望filteredByNodeNameIndex为'2'。
希望这个示例代码足够清晰:
<!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>
谁能发现这是错误的?
答案 0 :(得分:5)
尝试使用.filter
代替.find
:
var $obj_clone = $filtered.filter($obj);
.find
的问题在于它寻找匹配元素的子元素,而不是兄弟元素。来自文档:
获取当前匹配组中每个元素的后代 元素,由选择器,jQuery对象或元素过滤。
与.filter
相比:
将匹配元素集减少到与选择器匹配的元素集 通过功能测试。
答案 1 :(得分:2)
find仅搜索所选节点的子节点。您正在尝试使用filter的功能。您需要以下内容:
var $obj_clone = $filtered.filter($obj); // find original element again. Is something wrong here?
答案 2 :(得分:1)
在第三次尝试时,你试图找到孩子本身,这显然不会返回所需的值。
画报:
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.
答案 3 :(得分:0)
尝试:
var $obj_clone = $filtered.filter($obj);
.find()只查找孩子