我如何选择包含所有这些元素的一组元素的第一个父元素？
例如:
<body>
<dl>
<dt>Items:</dt>
<dd>
<ul>
<li>Item 1<div class="item-info">...</div></li>
<li>Item 2<div class="item-info">...</div></li>
<li>Item 3<div class="item-info">...</div></li>
</ul>
</dd>
</dl>
</body>
我想要这样的东西:
$('.item-info').commonParent();
它将返回相当于:
[$('ul')]
使用jQuery选择器有一种简单的方法吗？或者我要写一个插件？
如果您实际上正在寻找最低的共同祖先(请参阅此工作小提琴):
jQuery.fn.commonAncestor = function() {
var parents = [];
var minlen = Infinity;
$(this).each(function() {
var curparents = $(this).parents();
parents.push(curparents);
minlen = Math.min(minlen, curparents.length);
});
for (var i in parents) {
parents[i] = parents[i].slice(parents[i].length - minlen);
}
// Iterate until equality is found
for (var i = 0; i < parents[0].length; i++) {
var equal = true;
for (var j in parents) {
if (parents[j][i] != parents[0][i]) {
equal = false;
break;
}
}
if (equal) return $(parents[0][i]);
}
return $([]);
}
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="jquery.commonancestor.js"></script>
$(function() {
console.log($(".item-info").commonAncestor());
});
</script>
<body>
<dl>
<dt>Items:</dt>
<dd>
<ul>
<li>Item 1<b><div class="item-info">...</div></b></li>
<li>Item 2<u><div class="item-info">...</div></u></li>
<li>Item 3<i><div class="item-info">...</div></i></li>
</ul>
</dd>
</dl>
</body>
这尚未经过严格测试,因此请指出您看到的任何错误.
编辑返回父级而不是$(父级)
编辑在IE8中不起作用
8年后，我也面临着同样的问题，最终来到了这里。这些答案都不是我想要的，所以我最终得到了这个。它可能不是绝对最快的，但它很小而且简单：
$.fn.commonParents = function () {
var $children = this.toArray();
// reduce the parents to those where
return this.parents().filter(function (i, parent) {
// every child
return $children.every(function (child) {
// is contained by a that parent
return $.contains(parent, child);
});
});
};
要获得最接近的：
var $closestCommonParent = $elements.commonParents().first();
| 归档时间： |
|
| 查看次数： |
3271 次 |
| 最近记录： |