How to get class in jquery-Front-end Q&A-php.cn

How to get class in jquery

WBOY

Release： 2023-05-08 21:03:08

Original

4328 people have browsed it

How does jQuery get class?

jQuery is a popular JavaScript library that provides many easy-to-use functions and methods for working with HTML and CSS elements. In web pages, the HTML class attribute is often used to define styles and mark special elements. In jQuery, you can easily select specific elements and manipulate them using the .class selector. But how to get the value of class?

jQuery provides several methods to obtain the class of an element. Here are some commonly used methods:

.attr() method

## The #.attr() method can get or set the attribute value of an element. When we call .attr('class'), the class value of the element will be returned. For example:

let $element = $('.example');
let classValue = $element.attr('class');
console.log(classValue); // 输出元素的 class 值

Copy after login

.prop() method is used to get or set the attribute value. It is somewhat different from the .attr() method. It can only be used to get boolean properties, such as checked, readonly, etc. However, the class attribute is not a boolean, so we can use .prop('className') to get its value. For example:

let $element = $('.example');
let classValue = $element.prop('className');
console.log(classValue); // 输出元素的 class 值

Copy after login

.hasClass() method is used to check whether an element contains a specific class. If it does, it returns true , otherwise return false. For example:

let $element = $('.example');
let hasClass = $element.hasClass('my-class');
if (hasClass) {
  console.log('该元素包含 my-class');
} else {
  console.log('该元素不包含 my-class');
}

Copy after login

Using the above method, you can easily get the class value of the element and perform corresponding operations. However, it should be noted that if the element has multiple classes, the above method will only return one of them. If you need to get all classes, you can use the .hasClass() method combined with the .split() method to split the class into an array. For example:

let $element = $('.example');
let classValue = $element.attr('class').split(' ');
console.log(classValue); // 输出元素的所有 class，以数组形式展示

Copy after login

Summary

Obtaining the class value of an element is often used in daily web development. Using jQuery, you can easily obtain the class value of an element and perform corresponding operations. The above lists several commonly used methods. Among them, the .attr() and .prop() methods are more commonly used to obtain the attribute value of an element, while the .hasClass() method is more commonly used to determine whether an element contains a certain class. Using these methods can help us better operate various elements in web pages.

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