This series of articles mainly describes how to use Attributes (Attributes) of the jQuery framework. The articles include attribute, class, Html code, text, and value.
This article describes how to use attr (name), attr (properties), attr (key, value), attr (key, fn), and removeAttr (name.
If you have any suggestions or comments on this series of articles, please send to: sjzlgt@qq.com
You can go to the official jQuery website to learn more about jQuery.
You have tested IE6/7/8 and Firefox, and the results are all done.
Copyright: code-cat blog: http://www.cnblogs.com/bynet/ reprint please keep the original author, source and copyright information! |
1. attr (name) Usage
Definition: gets the attribute value of the First Matching Element. This method can be used to conveniently obtain the value of an attribute from the First Matching Element. If the element does not have a property, undefined is returned.
Returned value: Object
Parameter: name (String): attribute name
Instance: output the path, ID, Name, width, Alt, and Value of the first image in the DIV with ID "div_a1" to the div with ID 'div _ a1_1.
Code:
$ ("# Div_a1_1 "). append ('<span style = "color: Red;"> <strong> image quantity: $ ("# div_a1 img ") get '+ $ ("# div_a1 img "). size () + 'image </strong> </span> <br/> ');
$ ("# Div_a1_1 "). append ('path to the first image: '+ $ ("# div_a1 img "). attr ("src") + '<br/> ');
$ ("# Div_a1_1 "). append ('first image ID: '+ $ ("# div_a1 img "). attr ("id") + '<br/> ');
$ ("# Div_a1_1 "). append ('first image Name: '+ $ ("# div_a1 img "). attr ("name") + '<br/> ');
$ ("# Div_a1_1 "). append ('width of the first image frame: '+ $ ("# div_a1 img "). attr ("width") + '<br/> ');
$ ("# Div_a1_1 "). append ('alt: '+ $ ("# div_a1 img") in the first image frame "). attr ("alt") + '<br/> ');
$ ("# Div_a1_1 "). append ('<span style = "color: Red;"> <strong> Value of the first image frame:' + $ ("# div_a1 img "). attr ("Value") + '</strong> </span> <br/>'); // click the button to view the effect.
Div id = "div_a1"
Id = "div_a1_1"
You can try to output the attribute value of the text box above
Note: The selector $ ("# div_a1 img") gets two images, while att (name) only gets the attribute value of the first image. The img element does not have the value attribute, so the final output is 'undefined '.2. attr (properties) Usage
Definition: sets an object in the form of "name/value" to the attributes of all matching elements.
This is the best way to set multiple attributes in batches among all matching elements. Note: To set the class attribute of an object, you must use 'classname' as the attribute name. Or you can directly use. addClass (class) and. removeClass (class ).
Returned value: jQuery
Parameter: properties (Map): The "name/value pair" Object of the attribute.
Example: Set the src and alt attributes for all images in the DIV with ID "div_b1.
Code:
$ ("# Div_b1 img: eq (0)"). attr ({src: "http://www.bkjia.com/uploads/allimg/131023/122T340F-0.gif", alt: "Google "});
$ ("# Div_b1 img: eq (1)"). attr ({src: "http://www.bkjia.com/uploads/allimg/131023/122T34226-1.gif", alt: "yahoo"}); // click button 2 to see the effect
Div id = "div_b1"
3. attr (key, value) Usage
Definition: Set an attribute value for all matching elements.
Returned value: jQuery
Parameter: key (String): attribute name value (Object): Attribute value
Example: Set the src attribute for all images in the DIV with ID "div_c1.
Code:
$ ("# Div_c1 img: eq (0)"). attr ("src", "http://www.bkjia.com/uploads/allimg/131023/122T340F-0.gif ");
$ ("# Div_c1 img: eq (1)"). attr ("src", "http://www.bkjia.com/uploads/allimg/131023/122T34226-1.gif"); // click the button three to see the effect
Div id = "div_c1"
4. attr (key, fn) Usage
Definition: Set a calculated attribute value for all matching elements. Instead of providing a value, a function is provided. The value calculated by this function is used as the attribute value.
Returned value: jQuery
Parameter: key (String): attribute name fn (Function): Return Value Function range: Current element, parameter: index value of current element
Example: Set the title attribute value to the src attribute value for all images in the DIV with ID "div_d1.
Code: $ ("# div_d1 img "). attr ("src", function () {return this. title;}); // click the button four to see the effect div id = "div_d1"
5. removeAttr (name) Usage
Definition: delete an attribute from each matching element.
Returned value: jQuery
Parameter: name (String): name of the attribute to be deleted
Example: Delete the src attribute of all images in the DIV with ID "div_e1.
Code: $ ("# div_e1 img"). removeAttr ("src"); // click "5" to see the effect. div id = "div_e1"
