본문 바로가기

javascript

.attr() , .removeAttr() 사용법

.attr()

선택자에 의해 선택된 요소들 중에서 처음 요소의 속성값을 가지고 오는 함수

 

if) 모든 요소들의 속성값을 개별적으로 알고 싶다면,

.each() 메서드나 .map() 메서드를 사용해야 한다. 

 

.attr( attributeName )

선택된 요소 집합에서
첫번째 요소의 attributeName에 해당하는
속성값을 반환

ex)
$("form").attr("action");   // 첫 form 요소의 action 속성을 조회

var title = $("em").attr("title");  // 첫 em요소의 title 속성 값을 찾아서 

$("div").text(title);  // div에 표시

 

.attr( attributeName, value ) 

선택자에 의해 선택된 요소에 

하나 이상의 속성을 부여

 

ex)
$("#icon").attr("src", "icon.gif");  // src 속성에 값 지정

$("#banner).attr( { src: "banner.gif", alt: "Advertisement", width: 720 , height: 64 } );  // 한 번에 속성 4개를 지정

$("a").attr("target", "_blank");  // 모든 링크를 새 창에서 연다.

$("a").attr("target", function(){

  if(this.host === location.host) return "_self"
  else return "_blank";

});  // 도메인이 같은 링크는 같은 현재창에서 열고 다르면 새 창에서 연다. 

** 함수를 이렇게 넘길 수도 있다.**
$("a").attr({target: function() {...} });

 

.removeAttr( attributeName )

선택된 요소에서 속성을 완전히 제거

 

 ex)

$("a").removeAttr("target");  // 모든 링크를 현재 창에서 연다. 


참조 : https://solbel.tistory.com/365

 

[javascript & jquery] attr() 사용법

[javascript & jquery] attr() 사용법 attr()메서드는 HTML속성을 다루는 jQuery getter/setter 메서드이다. attr() 메서드는 브라우저 간 비호환성과 특이 사항을 잘 처리한다. 따라서 HTML 속성명과 이에 해당하는

solbel.tistory.com