<div class="codetitle"> <span><a style="CURSOR: pointer" data="6309" class="copybut" id="copybut6309" onclick="doCopy('code6309')"><u>코드 복사</u></a></span> 코드는 다음과 같습니다.</div> <div class="codebody" id="code6309"> <br><html xmlns="http://www. w3.org /1999/xhtml"> <br><head> <br><!-- <BR>1. 계층적 선택자: DOM 요소 간의 계층적 관계를 통해 요소를 얻습니다. 주요 계층적 관계에는 자손, 부모와 자식, 인접, 형제 관계를 통해 기본 클래스 관계를 사용하여 요소를 편리하고 빠르게 찾을 수 있습니다. <BR> jQuery 선택기에 대한 자세한 설명 <BR> 얻은 페이지의 다양한 요소에 따라 jQuery 선택기를 사용할 수 있습니다. 기본 선택기, 계층 구조 선택기, 필터 선택기, 양식 선택기의 네 가지 범주로 나뉩니다. 그 중 필터 선택기에는 단순 필터 선택기, 콘텐츠 필터 선택기, 가시성 필터 선택기, 속성 필터 선택기, 하위 요소 필터 선택기, 양식 개체 속성 필터 선택기 등 6가지 유형이 있습니다. <BR> 참고: 조상이 선택한 요소 집합 자손과 부모>자식은 다르다. 전자의 계층적 관계는 조상과 자손이고, 후자는 부모-자식 관계이다. 게다가 prev next는 .next()로 대체할 수 있고, prev~siblings도 사용할 수 있다. 대신 nextAll()을 사용하세요. <BR>--> <br><title></title> <br><!-- jQuery 계층적 선택기를 사용하여 요소 선택: 페이지에서 4개의 <div> <div>의 두 번째 블록에 <span> 태그를 추가하고 모든 요소의 초기 값을 숨긴 다음 jQuery 계층적 선택기를 사용합니다. . , 해당 페이지 마크업을 표시합니다. --> <br><script src="jquery-1.9.1.js" type="text/javascript"></script> <br><style type="text/css"> <br>body{font-size:12px;text-align:center;} <br>div,span{float:left;border:solid 1px #ccc;margin:8px;display:none} <br>.clsFraA {너비:65px;높이:65px} <br>.clsFraP{너비:45px;높이:45px;배경색:#eee} <br>.clsFraC{너비:25px;높이:25px;배경색:#ddd } <br></style> <br><script type="text/javascript"> <br>$(function () { <br>$('#divMid').css('display', 'block'); <br>$('divspan').css('display', 'block') //div의 모든 <span> 태그 표시 <br>}) <br>$(function () { <br>$('#divMid').css('display', 'block') <br>$('div>span').css('display', 'block'); <div>중성자<span> 표시<br>}) <br>$(function () { <br>$('#divMid div').css('display', 'block'); / /Display 다음 <div> <br>$('#divMid').next().css('display', 'block') <br>}) <br>$( function () { <br>$ ('#divMid ~ div').css('display', 'block'); //모든 <div> 표시 <br>$('#divMid ').nextAll().css('display', ' block'); <br>}) <br>$(function () { <br>$('#divMid').siblings('div').css('display','block'); //표시 ID가 divMid<div> <br>}) <br>/* siblings() 메소드와 prev~siblings 선택기의 차이점은 전자는 앞면과 뒷면에 관계없이 모든 인접 요소를 가져오는 반면 후자는 앞 부분이 아닌 마크 뒤에 있는 모든 인접 요소만 가져옵니다.*/ <br></head> <br><div class="clsFraA" > <br>왼쪽</div> <br><div class="clsFraA" id="divMid"><br><span class="clsFraP " Span1"> ;span class="clsFraC" id="Span2"> <br></span> <br></div> <br> >오른쪽_1</div> <br><div class="clsFraA"> <br>오른쪽_2</div> <br> <br><br>
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
