제이쿼리 아이디나 클래스 선택에 문의 드립니다. 채택완료
kisiki
9년 전
조회 5,054
안녕하세요 사내 해결할 사람이 없어 이렇게 문의를 드립니다.
이 경우에는 정상적으로 #External 이라는 엘리먼트에 두번째 만 block 됩니다.
</p><p><style></p><p>#External { display:none; }</p><p></style></p><p> </p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px;"><div id="External">1</div></span><span style="font-size: 14.6667px; line-height: 22px;"> </span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;"><div id="External">2</div></span><span style="font-size: 14.6667px;"> </span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;"><div id="External">3</div></span><span style="font-size: 14.6667px; line-height: 22px;"> </span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;"> </span></p><p><span style="font-size: 14.6667px;"><script></span></p><p> </p><p><span style="font-size: 14.6667px;">$(document).ready(function($) {</span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 1.5;">$("#External").eq(1).css("display","block");</span> </p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 1.5;">});</span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 1.5;"></script></span></p><p style="font-size: 14.6667px;"><span style="font-size: 11pt; line-height: 1.5;">
문제는 이럴 경우 #External display 이라는 div 가 블럭이 되질 않습니다.
</p><p style="font-size: 14.6667px;"><style></p><p style="font-size: 14.6667px;">#External { display:none; }</p><p style="font-size: 14.6667px;"></style></p><p style="font-size: 14.6667px;"> </p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px;"><div id="External display">1</div></span><span style="font-size: 14.6667px; line-height: 22px;"> </span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;"><div id="External </span><span style="font-size: 14.6667px; line-height: 1.5;">display</span><span style="font-size: 14.6667px; line-height: 22px;">">2</div></span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;"><div id="External </span><span style="font-size: 14.6667px; line-height: 1.5;">display</span><span style="font-size: 14.6667px; line-height: 22px;">">3</div></span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;"> </span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px;"><script></span></p><p style="font-size: 14.6667px;"> </p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px;">$(document).ready(function($) {</span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 1.5;">$("#External").eq(1).css("display","block");</span> </p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 22px;">$("#display").eq(1).css("display","block");</span><span style="font-size: 14.6667px; line-height: 1.5;"> </span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 1.5;">});</span></p><p style="font-size: 14.6667px;"><span style="font-size: 14.6667px; line-height: 1.5;"></script></span></p><p style="font-size: 14.6667px;"><span style="font-size: 11pt; line-height: 1.5;">
이렇게 id나 class가 다중 적용된 요소는 제이쿼리로 어떻게 적용시켜야 하나요?
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
9년 전
애초에 id 사용법을 잘못 알고 계시네요.
id는 한 페이지에서 유일해야 합니다.
저런 경우는 class를 사용하셔야 합니다.
.eq(n) 메소드는 equal의 준말이라 보시면 됩니다.
n번째 index랑 매칭이 되는 애만 선택해 줍니다.
근데 질문 자체는 무얼 하려고 하시는지 모르겠네요.
아래는 class가 External인 애들 중에서 index가 0보다 큰 애들만 적용을 하는 경웁니다.
.eq() 메소드는 :eq() 셀렉터도 있는 반면에 :gt()는 셀렉터뿐이 없네요.
</p><p><script type="text/javascript">
$(function() {
$(".External:gt(0)").css("display", "none");
});
</script></p><p><div class="External display">1</div>
<div class="External display">2</div>
<div class="External display">3</div></p><p>
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인