[jQuery] .attr의 사용 예

1. 요소(element)의 속성(attribute)의 값을 가져오거나

.attr( attributeName )

2. 요소에 속성을 추가

.attr( attributeName, value)

 

 

예제1

$( 'div' ).attr( 'class' );

// div 요소의 class 속성의 값을 가져옴

 

 

 

 

예제2

$( 'input' ).attr( 'placeholder', 'Input your address' );

// 선택한 요소에 속성을 추가

//  input 요소에 Input your address를 값으로 하는 placeholder 속성을 추가합니다.

 

 

 

 

 

 jQuery .attr()

• 선택된 요소의 애트리뷰트 값을 얻거나 설정하는 메소드
• 일치하는 요소 집합의 첫 번째 요소에 대한 속성 값을 가져옴
• 각 요소의 값을 개별적으로 얻으려면 jQuery .each()또는 .map()메서드 와 같은 반복 구조를 사용

<속성 설정 예제>

<img id="weather" src="good-weather.jpg" alt="summer">

 

* 예제1 : 속성변경 (alt속성을 summer에서 winter로 변경)

$("#weather").attr("alt", "winter");
// 변경하려면 속성 이름과 새 값을 .attr()메서드에 전달하면 됩니다.

 

 

* 예제2 : 속성추가 (title 속성 추가)

$("#weater").attr("title","korea-weather");

 

 

* 한번에 여러 속성 설정

$( "#greatphoto" ).attr({
  alt: "Beijing Brush Seller",
  title: "photo by Kelly Clark"
});

 

@ 주의 : 여러 속성을 설정할 때 속성 이름을 따옴표로 묶는 것은 선택 사항

@ 경고 : 'class' 속성을 설정할 때 항상 따옴표를 사용해야합니다!

 

 

 

 

 

속성(attribute)의 제거

• 속성(attribute)을 제거하고 싶다면 .removeAttr()을 사용