jQuery.attr()와.removeAttr()방법 조작 요소 속성 예시

오늘 은 jQuery 의.attr()와.removeAttr()방법 으로 요소 의 속성 을 읽 고,추가 하고,수정 하고,삭제 하 는 방법 을 공유 합 니 다.여러분 은 평소 웹 페이지 제작 에서 요소 의 속성 과 속성 값 을 어떻게 동적 으로 가 져 오 는 지,또는 동적 으로 요 소 를 수정 하 는 특정한 속성 값 을 만 났 습 니 다.그러면 jQuery 는 하나의(또는 여러 개)요소 의 모든 속성 을 쉽게 읽 고 추가 하거나 변경 하거나 삭제 할 수 있 습 니 다.jQuery 에서 우 리 는 다음 과 같은 방법 으로 실현 할 수 있 습 니 다.1.attr():jQuery 의 attr()방법 은 하나의 요소 의 속성 을 쉽게 읽 고 추가 하거나 수정 할 수 있 습 니 다(자세 한 내용 은.attr()참조).2.removeAttr():jQuery 의.removeAttr()방법 은 주로 하나의 요소 의 하나(또는 여러 개)속성 을 삭제 하 는 데 사 용 됩 니 다(자세 한 내용 은.removeAttr()를 참고 하 십시오.다음은.attr()와.removeAttr()두 가지 방법의 문법 형식 을 간단하게 살 펴 보 겠 습 니 다.attr()방법.attr()방법 은 두 가지 기능 이 있 습 니 다.첫 번 째 는 요소 의 속성 값 을 읽 는 것 이 고 두 번 째 는 요소 의 속성 값 을 수정 하여 속성 을 읽 는 문법.attr(attributeName)입 니 다./attributeName 은 가 져 올 요소 의 속성 명 에 문자열"string"을 되 돌려 줍 니 다.주의해 야 할 것 은.attr()방법 은 첫 번 째 일치 하 는 요소 의 속성 값 만 가 져 옵 니 다.각 요소 의 속성 값 이 필요 하 다 면 jQuery 의.each()또는.map()방법 으로 이 루어 져 야 합 니 다.요소 에 쉔 속성 값 을 설정 하 는 문법.attr(attributeName,value);/그 중에서 attributeName 은 요소 가 설정 해 야 할 속성 명 입 니 다.value 는 대응 하 는 요소 값 에서 대상 을 되 돌려 줍 니 다.주로 지정 한 요소 에 하나 이상 의 속성 을 설정 하 는 데 사 용 됩 니 다.removeAttr()방법.removeAttr(attributeName);/그 중에서 attributeName 은 제거 할 속성 명 입 니 다.removeAttr()방법 은 원생 javaScript 의 removeAttribute()함 수 를 사용 하지만 jQuery 대상 에 직접 접근 하여 호출 할 수 있다 는 장점 이 있 습 니 다.위 에서 우 리 는 함께 간단하게.attr()와.removeAttr()방법의 문법 을 알 아 보 았 습 니 다.다음은 구체 적 인 응용 을 살 펴 보 겠 습 니 다.먼저 간단 한 html Demo 를 살 펴 보 겠 습 니 다.이런 방법 은 그림 을 만 드 는 데 매우 편리 합 니 다.예 를 들 어 html:

 
<img src="images/a.jpg" alt="header" width="80" height="80" class="img"/> 

js:

 
$("document").ready(function(){ 
$(".img").hover(function(){ 
$(this).attr({ 
"src":"images/b.jpg", 
"alt":"change the page" 
}) 
},function(){ 
$(this).attr({ 
"src":"images/a.jpg", 
"alt":"header" 
}); 
}); 
});