제이쿼리 노드 작성법

Jquery

제이쿼리 노드 변수 사용하기

찾은 노드(변수) 사용법

실무에서는 찾은 노드의 개수가 몇개인지부터 시작해서 찾은 노드 에 순차적으로 접근하는 방법을 자주 사용합니다. 그리고 찾은 노드 중에서 특정 노드를 찾거나 걸러내야 하는 등의 작업을 진행하기도 합니다.

var $divs = $(‘div’);

위와 같이 노드를 대입한 변수를 ‘찾은 노드’라고 합니다.

이렇게 찾은 노드의 개수나 특정 노드를 걸러내야 하는 작업을 해야 합니다.

제이쿼리 변수에는 $ 을 붙여서 자바스크립트 변수와 구분하는 역할이 필요합니다.

변수는 재사용 데이터에 있어서 스크립트의 전체적인 유지보수에 큰 영향을 줄 수 있으니 일회성 값이 아닌 이상 반드시 변수를 선언하며 진행해주시는 것을 추천합니다.

$()

$()는 $ 함수를 호출한다는 뜻입니다.

$(‘div’).css(‘border’, ‘4px solid #f00’);
jQuery(‘div’).css(‘border’, ‘4px solid #f00’);

$('*')

전체노드를 선택할 때 사용합니다. HTML의 모든 태그를 선택할 수 있습니다.

<h1>제이쿼리</h1>
<h2>제이쿼리</h2>
$(‘*’).css(‘border’,’4px solid #ff0’);

$(‘태그명')

태그이름을 매개변수값으로 사용합니다. 태그 이름에 해당하는 노드를 찾습니다.

<h1>제이쿼리</h1>
<p>제이쿼리</p>
$(‘p’).css(‘border’,’4px solid #ff0’);

$(‘#아이디')

아이디 이름을 매개변수값으로 사용합니다. 아이디에 해당하는 노드를 찾습니다.

<h1>제이쿼리</h1>
<p id=‚header‛>제이쿼리</p>
$(‘#header’).css(‘border’,’4px solid #ff0’);

$(‘.클래스')

클래스 이름을 매개변수값으로 사용합니다. 클래스에 해당하는 노드를 찾습니다.

<h1>제이쿼리</h1>
<p class=‚test‛>제이쿼리</p>
$(‘.test’).css(‘border’,’4px solid #ff0’);

제이쿼리 노드 찾기

Comments, Trackbacks

제이쿼리 노드 변수 사용하기

찾은 노드(변수) 사용법