>웹 프론트엔드 >JS 튜토리얼 >요소 attribute_jquery를 조작하기 위한 jQuery .attr() 및 .removeAttr() 메소드의 예

요소 attribute_jquery를 조작하기 위한 jQuery .attr() 및 .removeAttr() 메소드의 예

WBOY
WBOY원래의
2016-05-16 17:28:401455검색

오늘은 jQuery의 .attr(), .removeAttr() 메소드를 사용하여 요소의 속성을 읽고 추가하고 수정하고 삭제하는 방법을 주로 공유하겠습니다. 일상적인 웹페이지 제작을 하다 보면 요소의 속성과 속성값을 동적으로 획득하거나, 요소의 특정(특정) 속성의 속성값을 동적으로 수정하는 방법을 누구나 접하게 됩니다. 그런 다음 jQuery를 사용하면 하나 이상의 요소에 있는 속성을 쉽게 읽고, 추가하고, 변경하거나 삭제할 수 있습니다. jQuery에서는 다음 방법을 사용하여 이를 달성할 수 있습니다.

1 .attr( ): .attr () 메소드를 사용하면 요소의 속성을 쉽게 읽고 추가하거나 수정할 수 있습니다. (자세한 내용은 .attr() 참조)
2 .removeAttr(): jQuery에서는 .removeAttr() 메소드가 주로 사용됩니다. 요소의 하나 이상의 속성을 삭제합니다(자세한 내용은 .removeAttr() 참조).

.attr() 및 .removeAttr() 두 메소드의 구문 형식을 간략하게 살펴보겠습니다.
.attr() 메소드
.attr() 메소드에는 두 가지 기능이 있습니다. 첫 번째는 요소의 속성값을 읽는 것이고, 두 번째는 요소의 속성값을 수정하는 것입니다.

속성 읽기 구문
.attr(attributeName);//attributeName은 속성 이름입니다.
위에서는 "string" 문자열을 반환합니다. .attr() 메서드는 각 요소의 속성 값이 필요한 경우에만 첫 번째 일치 요소의 속성 값을 가져옵니다. 개별 요소를 구현하려면 jQueryeach() 또는 .map() 메서드를 사용해야 합니다.

요소의 속성 값을 설정하는 구문
.attr(attributeName, value);//attributeName은 요소에 설정해야 하는 속성 이름이고 value는 해당 요소입니다. value
위에서 반환되는 것은 지정된 요소에 대해 하나 이상의 속성을 설정하는 데 주로 사용되는 개체입니다.

.removeAttr() 메소드
.removeAttr(attributeName);//여기서 attributeName은 제거할 속성 이름입니다.

.removeAttr() 메소드는 네이티브 javaScript에서 RemoveAttribute()를 사용합니다. 기능이지만 장점은 jQuery 개체에서 직접 액세스하고 호출할 수 있다는 것입니다.
위에서 우리는 .attr() 및 .removeAttr() 메소드의 구문에 대해 간략하게 배웠습니다. 먼저, 간단한 HTML 데모를 살펴보겠습니다.

이 메소드는 다음과 같습니다.
html:

코드 복사 코드는 다음과 같습니다.

header

js:
코드 복사 코드는 다음과 같습니다.

$("document") .ready(function(){
$(".img").hover(function(){
$(this).attr({
"src":"images/b.jpg",
"alt":"페이지 변경"
})
},function(){
$(this).attr({
"src":"images/a.jpg " ,
"alt":"header"
});
});
});
성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.