5
<div class="menu-items-wrapper" style="width: 547px;">
   <div class="one" style="height: 134px;">
   <div class="two" style="display:none;height: 134px;">
   <div class="other" style="height: 134px;">
   <div class="new" style="display: none; height: 134px;"></div>
</div>

我希望从上面的 html 中获取最后一个可见的直接子级。请注意,每个子 div 中都有更多的 html,所以这就是我想要直接子的原因。

我现在拥有的

  jQuery(".menu-items-wrapper > div").find(":visible:last-child").css("border-right","0px");

或者

  jQuery(".menu-items-wrapper > div").find(":visible:last").css("border-right","0px");

但我不能让最后一个直接孩子没有边界。谁能帮忙

忘了提到我在页面中有 12 次这样的 div 并希望将其应用于所有出现。目前它只在最后一项上工作

4

2 回答 2

9

.find()在给定的元素集中查找子元素,这里不会产生任何元素,因为执行它的集合是 DOM 中最低级别的元素。

您需要:visible:last立即向div选择器申请:

$(".menu-items-wrapper > div:visible:last").css("border-right","0px");​

演示

因为.find()您必须在父节点上运行它:

$(".menu-items-wrapper").find("div:visible:last")

要不就

$(".menu-items-wrapper").find(":visible:last")

编辑

考虑到您在评论中的添加。在有多个menu-items-wrapper元素的场景中,:last不能以这种方式使用,因为它总是选择集合中的最后一个元素。另一方面:last-child,如果您总是想要每个容器中的最后一个元素,则可能会起作用,但这当然不是这种情况,因为最后一个孩子可能不是最后一个可见的孩子。

对于这种情况,您必须遍历容器:

$(".menu-items-wrapper").each(function() {
    $('div:visible:last', this).css("border-right","0px");
});

演示

于 2012-09-03T12:51:54.113 回答
0

利用jQuery('.menu-items-wrapper').children('div:visible:last').css(borderRight: '0px');

于 2012-09-03T12:55:08.997 回答