jQuery操作兄弟元素
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>title</title>
<style>
ul {
list-style-type: none;
cursor: pointer;
}
</style>
<script src="jquery-1.12.1.js"></script>
<script>
$(function () {
$("#three").click(function () {
// 获取某个li的下一个兄弟元素
$(this).next("li").css("backgroundColor","yellowgreen");
// 获取某个li的前一个兄弟元素
$(this).prev("li").css("backgroundColor","greenyellow");
// 获取某个li的后面的所有的兄弟元素
$(this).nextAll("li").css("backgroundColor","red");
// 获取某个li的前面的所有的兄弟元素
$(this).prevAll("li").css("backgroundColor","red");
// 获取当前的li的所有的兄弟元素
$(this).siblings("li").cssjquery在一个元素后追加标签("backgroundColor","gray");
});
});
</script>
</head>
<body>
<ul id="uu">
<li>凤</li>
<li>芙蓉</li>
<li id="three">犀利哥</li>
<li>大力哥</li>
<li>小月月</li>
<li>小胖</li>
<li>小明</li>
<li>小红</li>
</ul>
</body>
</html>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。