siblings() 일치하는 집합에 있는 각 요소의 형제를 가져옵니다. 선택기로 필터링하는 것은 선택 사항입니다.
jQuery의 순회 메소드 siblings()
$("给定元素").siblings(".selected") 이 기능은 주어진 형제 요소를 필터링하는 것입니다(주어진 요소 자체는 제외)
예: 웹페이지 옵션 표시줄
탭을 클릭하면 다른 두 탭의 스타일이 변경되고 해당 내용이 숨겨집니다.
다음은 html 코드입니다.
<body> <ul id="menu"> <li class="tabFocus">家居</li> <li>电器</li> <li>二手</li> </ul> <ul id="content"> <li class="conFocus">我是家居的内容</li> <li>欢迎您来到电器城</li> <li>二手市场，产品丰富多彩</li> </ul> </body>
jQuery 코드
<script type="text/javascript">
$(function() {
$("#menu li").each(function(index) { //带参数遍历各个选项卡
$(this).click(function() { //注册每个选卡的单击事件
$("#menu li.tabFocus").removeClass("tabFocus"); //移除已选中的样式
$(this).addClass("tabFocus"); //增加当前选中项的样式
//显示选项卡对应的内容并隐藏未被选中的内容
$("#content li:eq(" + index + ")").show()
.siblings().hide();//#menu与#content在html层没有嵌套关联，但因为其ul序列相同，用index值可以巧妙的将两者关联。
});
});
})
</script> 어느
해당 탭을 클릭하면 클릭한 탭의 내용이 표시()됩니다. 다른 두 형제 요소
이렇게 하면 클릭한 영역의 내용이 동적으로 표시되고 다른 두 탭은 숨겨질 수 있습니다.
그리고
$("给定元素").siblings(".selected")의 (".selected")는 .selected라는 지정된 요소 클래스의 형제 요소를 필터링한다는 의미입니다(주어진 요소 자체는 제외).
위 내용은 jQuery siblings() 사용 예제에 대한 자세한 설명입니다. 모든 분들께 도움이 되길 바랍니다!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
