선택자 (4) 썸네일형 리스트형 제이쿼리(jQuery) 기초 문법 - 선택자 (5) 콘텐츠 탐색 선택자 제이쿼리(jQuery) 기초 문법 탐색 선택자 탐색 선택자를 사용하면 기본 선택자로 선택한 요소 중 원하는 요소를 한 번 더 탐색해서 좀 더 정확하게 서택할 수 있다. 대표적인 탐색 선택자에는 배열의 인덱스(index)를 사용해 선택하는 '위치 탐색 선택자'와 배열에 담겨진 요소 중 지정된 속성과 값으로 선택하는 '속성 탐색 선택자'가 있다. 콘텐츠 탐색 선택자 콘텐츠 탐색 선택자 종류 종류 사용법 설명 $("요소 선택:contains(텍스트)") $("li:contains('내용')") 요소 중 '내용2'라는 텍스트를 포함하는 요소만 선택한다. $("요소 선택").contents() $("p").contents() 선택한 p 요소의 하위 요소 중 가장 가까운 하위 요소를 선택한다. $("요소 선택:ha.. 제이쿼리(jQuery) 기초 문법 - 선택자 (3) 인접 관계 선택자 제이쿼리(jQuery) 기초 문법 선택자 선택자는 HTML요소를 선택하여 가져온다. 제이쿼리 선택자는 CSS선택자와 마찬가지로 선택한 요소의 디자인 속성을 적용할 때 사용할 수 있다. 이때 HTML에 작성한 스타일을 사용자의 동작에 의해 스타일을 변경할 수 없기 때문에 HTML에서 작성한 스타일(CSS)는 정적이다라고 표현한다. 하지만 제이쿼리 선택자를 사용하면 동적으로 스타일을 적용할 수 있다. 기본 선택자 영역에 있는 문서 객체를 선택할 수 있는 선택자를 알아보자. 제이쿼리의 기본 선택자는 다음과 같이 직접 선택자와 인접 관계 선택자로 나눌 수 있다. 인접 관계 선택자 인접 관계 선택자는 직접 선택자로 요소를 먼저 선택하고 그 다음 선택한 요소와 가까이에 있는(이전과 다음 요소)요소를 선택할 때 사용.. 제이쿼리(jQuery) 기초 문법 - 선택자 (2) 직접 선택자, 메소드 체이닝 기법 제이쿼리(jQuery) 기초 문법 선택자 선택자는 HTML요소를 선택하여 가져온다. 제이쿼리 선택자는 CSS선택자와 마찬가지로 선택한 요소의 디자인 속성을 적용할 때 사용할 수 있다. 이때 HTML에 작성한 스타일을 사용자의 동작에 의해 스타일을 변경할 수 없기 때문에 HTML에서 작성한 스타일(CSS)는 정적이다라고 표현한다. 하지만 제이쿼리 선택자를 사용하면 동적으로 스타일을 적용할 수 있다. 기본 선택자 영역에 있는 문서 객체를 선택할 수 있는 선택자를 알아보자. 제이쿼리의 기본 선택자는 다음과 같이 직접 선택자와 인접 관계 선택자로 나눌 수 있다. 직접 선택자 직접 선택자는 주로 멀리 떨어진 요소를 직접 선택할 때 사용하는 선택자이다. 직접 선택자의 종류로는 전체(*), 아이디(#), 클래스(.).. 제이쿼리(jQuery) 기초 문법 - 선택자 (1) 기본 선택자 종류 제이쿼리(jQuery) 기초 문법 선택자 선택자는 HTML요소를 선택하여 가져온다. 제이쿼리 선택자는 CSS선택자와 마찬가지로 선택한 요소의 디자인 속성을 적용할 때 사용할 수 있다. 이때 HTML에 작성한 스타일을 사용자의 동작에 의해 스타일을 변경할 수 없기 때문에 HTML에서 작성한 스타일(CSS)는 정적이다라고 표현한다. 하지만 제이쿼리 선택자를 사용하면 동적으로 스타일을 적용할 수 있다. 문서 객체 모델 문서 객체 모델(DOM, Doucument Object Model)이란 HTML 문서 객체 구조를 말한다. 문서 객체 모델(DOM)은 HTML 문서구조를 말한다. HTML문서의 기본 구조는 최상위 객체로 이 있으며, 그 하위 객체로는 내용 제이쿼리가 먼저 실행되고 그 다음 영역에 문서 객체를 불.. 이전 1 다음