study:php:jquery_셀렉터

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

--- study:php:jquery_셀렉터 [2011/08/11 15:56]
kamajaki0601
+++ study:php:jquery_셀렉터 [2011/08/11 17:01] (현재)
kamajaki0601
@@ 줄 61: / 줄 61: @@
 </code>
-$("p a")는 1.aspx 링크와 2.aspx 링크 모두를 선택하지만, $("p > a")는 2.aspx 링크만을 선택한다는 것
+$("p a")는 1.aspx 링크와 2.aspx 링크 모두를 선택하지만, $("p > a")는 2.aspx 링크만을 선택한다는 것 \\
+다음과 같은 html 있다고 가정할 경우에, div + p 및 div ~ p오 ㅏ같은 경우는 자식이 아니라 형제 요소와 연관이 있다. \\
+<code html>
+<div>앨범 목록</div>
+<p>노라조</p>
+<span>수퍼맨</span>
+<p>이적</p>
+<span>다행이다</span>
+<p>현진영</p>
+<span>Break me down</span>
+</code>
+$("div + p")는 div 바로 다음에 나오는 형제 수준의 p 요소, 즉, "노라조"를 선택하게 되는 반면, \\
+$("div ~ p")는 div 요소 다음에 나오는 형제 요소들 중 모든 p 요소, 즉, "노라조", "이적", "현진영"과 일치된다. \\ \\
+더불어, a[title]이나 a[href^="mailto:"]와 같이 어트리뷰트를 기반으로 하는 필터링도 가능하다. \\
+특정 어트리뷰트가 존재하거나, 그 어트리뷰트 값이 특정 값으로 시작 혹은 끝나거나, 특정 값을 포함하거나 하는 부분까지 비교해서 선택할 수 있다. \\
+**다음은 이러한 어트리뷰트 필러의 예**
+<code>
+a[title] : title 어트리뷰트를 갖는 하이퍼 링크와 일치된다.
+a[href^="mailto:"] : href 값이 mailto로 시작하는 하이퍼 링크와 일치된다.
+a[href$=".pdf"] : pdf 파일에 링크가 걸린 모든 하이퍼링크와 일치된다.
+a[href*="taeyo.net"] : taeyo.net이라는 값이 포함되어 있는 모든 하이퍼 링크와 일치된다.
+input[type="text"] : text 형식의 입력 컨트롤과 일치된다.
+</code>
+이러한 선택이 가능한 것은 시작부분(^) 혹은 끝부분($)을 가리키는 정규 표현식을 jQuery가 지원하기 때문이다. \\
+**출처 : http://www.taeyo.pe.kr/Columns/View.aspx?SEQ=354&PSEQ=29&IDX=0**

study/php/jquery_셀렉터.1313045808.txt.gz · 마지막으로 수정됨: 2011/08/11 15:56 저자 kamajaki0601