Shulou(Shulou.com)06/01 Report--

This article mainly introduces the relevant knowledge of "how to use attr". The editor shows you the operation process through an actual case. The operation method is simple, fast and practical. I hope this article "how to use attr" can help you solve the problem.

.attr (attributeName, value)

Description: sets one or more attributes for each matching element.

Attr (attributeName, value)

AttributeName

Type: String

The name of the property to set the value

Value

Type: String,Number

The value set by this property

Attributes

Type: PlainObject

A property-value collection object. (translator's note: for example, {alt:'', title: 'WEB front-end development-http://www.css88.com})

AttributeName

Type: String

The name of the property to set the value.

Function (index, attr)

Type: Function ()

This function returns the value used to set, and this points to the current element. The receive index parameter represents the index position of the element in the matching collection and the html parameter represents the original HTML content on the element.

This .attr () method is a convenient and powerful way to set property values-especially when setting multiple properties or using values from functions. Let's consider the following picture:

Setting a simple attribute (set a simple property)

We can simply change the alt property and attach a new value through the .attr () method:

$('# greatphoto'). Attr ('alt',' Beijing Brush Seller')

We can add an attribute in the same way:

$('# greatphoto')

.attr ('title',' Photo by Kelly Clark')

Setting several attributes at once (set multiple properties at a time)

To change the alt property and add the title property at the same time, we can pass it to this method using an object (JavaScript object literal) in the form of "name / value". Each key-value object adds or modifies one property:

('# greatphoto') .attr ({

Alt: 'Beijing Brush Seller'

Title: 'photo by Kelly Clark'

})

When setting multiple properties, the quotation marks of the package property name are optional.

Warning: when setting the style name ("class") property, you must use quotation marks!

Note: jQuery forbids changing the type feature (attribute) of an or element, and an error will be thrown in all browsers. Because Internet Explorer does not allow you to change the type attribute of an element.

Computed attribute values (extrapolated attribute values)

By using a function to set the property, you can return the final desired attribute value based on the other attribute values on the element. For example, we can associate a new value with an existing value:

$('# greatphoto'). Attr ('title', function (I, val) {

Return val +'- photo by Kelly Clark'

})

Currently, a function is used to calculate the value of an attribute, which is especially useful when we modify the attributes of multiple elements.

Note that if the setter function does not return any data (for example: function (index, attr) {}), the current value of the property returns undefined as a getter behavior. In fact, if you don't make any changes, the setter function does not return something.

Example:

Example: for all the

Set some properties.

Img {padding:10px;}

Div {color:red; font-size:24px;}

Attribute of Ajax

("img") .attr ({

Src: "images/hat.gif"

Title: "jQuery"

Alt: "jQuery Logo"

})

$("div") .text ($("img") .attr ("alt"))

This is the end of the introduction to "how to use attr". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.