jQuery – 속성 또는 속성 값으로 선택자 지정하기

본문에서 alt 값이 “이미지 설명”을 가진 이미지를 선택하여 지우거나 이동하거나 등등 처리를 할 때가 있을 것이다.

이럴 때 이 alt에 대한 값을 찾아서 선택자(selector)로 지정할 수 있다.

사용법은 간단하다.

$('img[alt=이미지 설명]');

 위 코드는 <img src = “test.jpg” alt=”이미지 설명” /> 와 같은 이미지를 선택하여 처리할 때 쓰인다.

 

또는 이미지들 중에 alt값을 가진 것만 찾을 때는

$('img[alt]');

 이렇게 alt만 넣어도 된다.

 

이 속성 또는 속성값에 의해 선택자 지정은 꼭 해당 되는 것만 선택할 수 있는 것은 아니다.
여러가지 방법으로 그 외의 선택자들도 구할 수 있다.

$('input[type=radio]');
/*인풋 엘리먼트들 중에 라디오 버튼만 해당된다.*/

$('input[type!=radio]');
/*인풋 엘리먼트들 중에 라디오 버튼을 제외한 인풋 엘리먼트들이 해당된다.*/

$('input[type=radio][checked=checked]');
/*인풋 엘리먼트들 중에 라디오 버튼들 중에 체크되어 있는 인풋 엘리먼트들이 해당된다.*/

$('input[value*=TEST]');
/* 인풋 엘리먼트들 중에 값안의 내용중 'TEST'라는 내용을 포함하고 있는 인풋 엘리먼트들이 해당된다.
ex) <input type='text' value='This is TEST' /> */

$('img[src^=images]');
/*이미지 엘리먼트들 중에 값안의 내용이 'images'라는 내용으로 시작되는 인풋 엘리먼트들이 해당된다.
ex) <img src="images_1.jpg" /> */

$('img[src^=.png]');
/*이미지 엘리먼트들 중에 값안의 내용이 'images'라는 내용으로 끝나는 인풋 엘리먼트들이 해당된다.
ex) <img src="button_images.png" /> */

 

TOP