본문 바로가기

셀렉터3


jQuery (제이쿼리) - jQuery 동일 노드 엘리먼트 선택하기 (셀렉터 +, ~) 이번에는 제이쿼리에서 동일 노드에 위치한 엘리먼트를 선택하는 방법에 대해서 알아보자. 첫번째 노드입니다. 중간계 노드입니다. 두번째 노드입니다. 세번째 노드입니다. 네번째 노드입니다. 다섯번째 노드데스요. 여섯번째다. 칠번째다. $(document).ready(function() { alert($("div + p").length); alert($("div ~ p").length); }); 위의 소스를 실행시켜보면 첫 번째 alert 은 2 의 값이 리턴되고 두 번째 alert 는 3 의 값이 표시된다. 위의 소스를 보면 3개의 세 개의 1레벨 div 노드가 있고 그 안에 태그들이 있는 형식인데... + 의 경우는 앞서 공부했던 > 와 마찬가지로 해당하는 태그와 인접해있어야만 선택이 된다. 단, 첫번째 위.. 2018. 6. 10.
jQuery (제이쿼리) - jQuery Selector 실습 앞서 제이쿼리에서 사용하는 기본적인 셀렉터에 대해 알아봤었는데 이번엔 그 실습을 해보자. $(function () { var jq = $("#pTag"); alert(jq.html()); jq = $("p"); alert(jq.html()); jq = $(".pTag"); alert(jq.html()); jq = $("[name=pTag]"); alert(jq.html()); }); Hello, jQuery! $(function() {}); 구문은 document.ready 와 같은 구문이다. 복잡하게 알려고 하지 말고 그냥 그렇구나 하고 넘어가는 것이 정신건강에 좋다.$(document).ready(function() {}); 의 형태로 많이 사용된다. html() 은 제이쿼리 셀렉터로 선택된 jQue.. 2018. 5. 27.
jQuery (제이쿼리) - jQuery Selector (제이쿼리 선택자/셀렉터) jQuery(이하 제이쿼리) 의 Selector(이하 셀렉터) 는 기본적으로 $ 을 붙여 사용한다. jQuery Selector : $( ) $ 대신 jQuery 를 붙여 jQuery( ) 의 형태로도 사용이 가능하지만 보통은 $ 를 사용한다. (예전에 있던 프로젝트 부장이 공통모듈 만든다고 $ 를 사용한 소스를 만들었다가 낭패였던 기억이...) 위에도 써놨듯 셀렉터는 $( ) 의 기본 형태를 갖는데 의미 없이 이렇게 만들어 진 것이 아니라 이 형태 자체가 하나의 함수라고 볼 수 있으며 자바스크립트와 비교하자면 $ 는 함수명이고 괄호 안에 파라미터를 적어 넘김으로써 하나의 함수가 실행된다고 볼 수 있다. 예를 들어 $('div') 라는 구문을 사용했다면 $ 라는 함수에 div 라는 파라미터를 넘긴 것과 .. 2018. 5. 27.