공부 기록노트/javascript
[jQuery] 노드 다루기-4 (eq()와get()의 차이)
css body div1 div2 div3 div4 div5 script $(document).ready(function(){ //div가 5개 생성되고 div객체들을 배열로 저장하고 있다. var $divList = $("div"); //get()는 리턴값이 Element요소가 넘어온다. 하여 get()받은 것을 //style을 설정하고자 한다면 자바스크립트 방법으로 줘야 한다. var $div_one = $divList.get(0); //배열은 0부터 시작을 하니 인덱스가 1이라면 2번째의 div만 가져오고 있다. //eq() 리턴값이 div의 jQuery객체가 넘어온다. var $div_two = $divList.eq(1); //index를 주면 해당인덱스의 값을 리턴 //[]로 인덱스를 주어 노드..
[jQuery] 노드 다루기-2 (속성으로 노드 찾기)
이전 노드 다루기-1에서의 샘플코드를 이용하여 실습해보자. 속성으로 노드를 찾는 방법은 아래와 같다. $("E[A]") : 속성 A를 포함한 모든 E노드를 찾기 $("E[A=V]") : 속성 A의 값이 V인 모든 E노드를 찾기 $("E[A^=V]") : 속성 A의 값이 V로 시작하는 모든 E노드를 찾기 $("E[A$=V]") : 속성 A의 값이 V로 끝나는 모든 E노드를 찾기 $("E[A*=V]") : 속성 A의 값이 V를 포함하고 있는 모든 E노드를 찾기 $("E[A]") : 속성 A를 포함한 모든 E노드를 찾기 $(document).ready(function(){ //class속성으로 되어 있는 태그들에게 아래 css() 적용함. $("[class]").css("border", "5px solid r..
[jQuery] 노드 다루기-1 (아이디, 태그이름, 클래스 이름으로 찾기)
프로젝트 하면서 화면단 만들때 원하는 노드를 찾아서 이벤트를 적용하는게 가장 어려웠던 것 같다. 오랜만에 jQuery 수업을 다시 들으면서 감을 익혀보기로 한다. jQuery를 쓰기위해서는 CDN또는 라이브러리에 설치하는 방법 2가지가 있다.(방법 생략) jQuery를 쓰기위해서 실습코드에는 기본적으로 아래 코드를 작성해두었다. css와 body영역은 샘플코드를 제공 body 더보기 샘플페이지(div, id=samplePage, class=page) 헤더 영역(div, id="header") 노드 찾기(div, id=content class=sample-content=) 일반 노드 찾기(ul, class=menu) id로 찾기(li, data-value=1) tag로 찾기(li, class=select)..