JQuery. attr () and. removeAttr () method operation element property example

Today we will share with you how to use jQuery's. attr () and. removeAttr () Methods to read, add, modify, and delete attributes of elements. In normal Web page creation, you have encountered how to dynamically obtain the attributes and attribute values of an element, or dynamically modify the attribute values of a certain attribute of an element. JQuery allows us to easily read, add, modify, or delete any attribute in one (or more) element. In jQuery, we can use the following method to implement it:

1. attr (): The. attr () method in jQuery allows you to easily read, add or modify attributes of an element (for details, see. attr ());
2. removeAttr (): The. removeAttr () method in jQuery is mainly used to delete one or more attributes of an element (for details, see. removeAttr ()).

The syntax format of the. attr () and. removeAttr () methods is as follows:
. Attr () method
The. attr () method has two functions: the first is to read the attribute value of an element, and the second is to modify the attribute value of an element.

Read attribute syntax
. Attr (attributeName); // attributeName is the attribute name of the element to be retrieved.
The above returns the string "string", which is worth noting. the attr () method only obtains the attribute value of the First Matching Element. If you need the attribute value of each individual element, You need to rely on jQuery's. each () or. map () method.

Syntax for setting attribute values for an element
. Attr (attributeName, value); // Where attributeName is the attribute name to be set for the element, and value is the corresponding element value
The returned object is used to set one or more attributes for a specified element.

. RemoveAttr () method
. RemoveAttr (attributeName); // Where attributeName is the name of the attribute to be removed

The. removeAttr () method uses the removeAttribute () function in the native javaScript, but its advantage is that it can be directly accessed and called by jQuery objects.
The above briefly describes the syntax of the. attr () and. removeAttr () methods. Let's take a look at its specific application. First, let's look at a simple html Demo:

This method is convenient for image flip, for example:
Html:
Copy codeThe Code is as follows:


Js:
Copy codeThe Code is as follows:
$ ("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"
});
});
});