我有一个 HTML 结构:
<div class="mydiv">xx
<span>test1</span>
<span>test2</span>
<div class="inerdiv">
<span>inner span</span>
</div>
</div>
<span>test3</span>
Run Code Online (Sandbox Code Playgroud)
现在我想将样式应用于包含 "inner span" 的跨度。
$(function() {
$(".mydiv").click(function() {
$(".mydiv").next().find("span").css("border", "1px solid yellow");//not working
});
});
Run Code Online (Sandbox Code Playgroud)
什么应该是正确的代码?
代替:
$(".mydiv").next().find("span").css("border", "1px solid yellow");
Run Code Online (Sandbox Code Playgroud)
和:
$(".mydiv .innerdiv span").css("border", "1px solid yellow");
Run Code Online (Sandbox Code Playgroud)
我不认为next()你认为它会做什么。
next() 返回所有先前匹配元素的直接下一个兄弟元素。
鉴于标记:
<div class="hello">foo1</div><span>bar1</span>
<div class="goodbye">foo2</div><span>bar2</span>
<div class="hello">foo3</div><span>bar3</span>
Run Code Online (Sandbox Code Playgroud)
以下将返回包含bar1和的跨度元素bar3:
$("div.hello").next()
Run Code Online (Sandbox Code Playgroud)
因此,无法<div class="innerdiv">从外部divusing 获取next(),因为它们不是兄弟姐妹。