我想在下面的示例中获取类.child
的高度值,然后使用警报显示故障排除的值。
我有两个元素.first
和.second
是兄弟姐妹,.second
元素有一个名为.child
的孩子
HTML:
<div class="parent">
<div class="first">Click Me</div>
<div class="second">
<div class="child"></div>
</div>
</div>
CSS:
.first {
width: 60px;
padding: 8px;
background: blue;
}
.child {
height: 1234px;
}
jQuery:
$(".first").click(function() {
var childHeight = $(this).next(".second > .child").outerHeight();
alert(childHeight);
});
问题似乎是针对孩子,如果我从我的var中移除> .child
,则会返回.second
的高度
这是一个JS小提琴,代码相同:https://jsfiddle.net/CultureInspired/6dxLp86b/
答案 0 :(得分:1)
您应该使用.next(".second").find(".child")
正确获取子元素。
这将获得下一个元素,然后在其中找到.child
元素。
$(".first").click(function() {
var childHeight = $(this).next(".second").find(".child").outerHeight();
alert(childHeight);
});
&#13;
.first {
width: 60px;
padding: 8px;
background: blue;
}
.child {
height: 1234px;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="parent">
<div class="first">Click Me</div>
<div class="second">
<div class="child"></div>
</div>
</div>
&#13;