How to traverse properties in jquery

jQuery is a very popular JavaScript library that provides many convenient methods to manipulate HTML documents and web page elements. One very useful method is to iterate over properties. In this article, we will introduce how to iterate through properties using jQuery.

First, let's take a look at the methods provided by jQuery to traverse properties. They include:

• attr(): Used to get or set the attribute value of an element.
• prop(): Used to get or set the attribute value of an element.
• data(): Used to get or set the custom data attribute value of an element.
• removeAttr(): Used to remove attributes of an element.
• hasClass(): Used to detect whether an element has the specified class.

Below we will introduce the usage and examples of each method respectively.

1. attr()

attr() method can be used to get or set the attribute value of an element. It takes two parameters: attribute name and attribute value. If only the property name is passed in, the value of the property will be returned; if both the property name and the property value are passed in, the value of the property will be set.

// 获取属性值
var href = $('#myLink').attr('href');

// 设置属性值
$('#myLink').attr('href', 'http://www.example.com');

2. prop()

prop() method is similar to the attr() method , it can also be used to get or set the attribute value of an element. However, the prop() method is more suitable for getting or setting Boolean properties (such as checked, disabled, selected, etc.) value.

// 获取属性值
var checked = $('#myCheckbox').prop('checked');

// 设置属性值
$('#myCheckbox').prop('checked', true);

3. data()

data() method can be used to get or set custom data of an element attribute value. It has one parameter: the property name. If only the property name is passed in, the value of the property will be returned; if both the property name and the property value are passed in, the value of the property will be set.

// 获取属性值
var name = $('#myDiv').data('name');

// 设置属性值
$('#myDiv').data('name', 'John');

4. removeAttr()

removeAttr()The method can be used to remove attributes of an element. It has only one parameter: the property name.

// 移除属性
$('#myImage').removeAttr('title');

5. hasClass()

hasClass() method can be used to detect whether an element has the specified class. It has only one parameter: class name. If the element has this class, it returns true; otherwise, it returns false.

// 检测是否拥有class
if ($('#myDiv').hasClass('active')) {
  // ...
}

Summary

By using the above jQuery method, you can easily traverse and manipulate the attribute values ​​​​of HTML elements. The attr() and prop() methods are used to get or set the attribute value of the element; the data() method is used to get or set the custom data of the element Attribute value; removeAttr() method is used to remove the attribute of the element; hasClass() method is used to detect whether the element has the specified class. In actual projects, you can choose the appropriate method to traverse the properties of elements as needed.

The above is the detailed content of How to traverse properties in jquery. For more information, please follow other related articles on the PHP Chinese website!