본 글의 예시에서는 자바스크립트 탭 전환의 원리와 효과 구현 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 구현 방법은 다음과 같습니다. 코드 복사 코드는 다음과 같습니다. <br> #컨테이너{테두리:단색 1px 녹색;너비:300px;높이:300px;}<br> li{float:left;margin-left:20px;}<br> p{float:left;}<br> #스포츠,#군사,#bbs{display:none;}<br> </스타일><br> <script type="text/javascript"><br> 함수 탭(pid){<br> var ps = ['뉴스','스포츠','군사','bbs'];<br> for(var i=0,len=ps.length;i<len;i ){<br /> if(ps[i] == pid){<br /> Document.getElementById(ps[i]).style.display = "차단";<br /> }그밖에{<br /> Document.getElementById(ps[i]).style.display = "없음";<br /> }<br /> }<br /> }<br /> </script><br /> </머리><br> <br> <div id="컨테이너"><br> <ul> <br> <li onmouseover="tab('news');">뉴스</li><br> <li onmouseover="tab('sports');">스포츠</li><br> <li onmouseover="tab('military');">군사</li><br> <li onmouseover="tab('bbs');">포럼</li><br> </ul> <br> <p id="news">뉴스 뉴스 뉴스 뉴스 뉴스</p><br> <p id="sports">스포츠 스포츠 스포츠 스포츠 스포츠</p><br> <p id="military">군군군군군군군</p><br> <p id="bbs">포럼 포럼 포럼 포럼 포럼</p><br> </div><br> </본문><br> </div>
