Home > Web Front-end > Front-end Q&A > Can jquery add new attributes to elements?

Can jquery add new attributes to elements?

WBOY
Release: 2022-06-17 16:35:10
Original
1843 people have browsed it

jquery can add new attributes to elements; jquery can use the attr() method to add new attributes to elements. This method is used to set or return the attributes and values ​​of the specified element. The first parameter in brackets is set For a newly added attribute, just set the second parameter to the value of the new attribute, and the syntax is "$(selector).attr(attribute,value)".

Can jquery add new attributes to elements?

The operating environment of this tutorial: windows10 system, jquery3.6.0 version, Dell G3 computer.

Can jquery add new attributes to elements

jquery can add new attributes to elements

attr() method sets or returns the attribute of the selected element Properties and values.

When this method is used to return an attribute value, the value of the first matching element is returned.

When this method is used to set attribute values, one or more attribute/value pairs are set for the matching element.

Syntax

Return the value of the attribute:

$(selector).attr(attribute)
Copy after login

Set the attribute and value:

$(selector).attr(attribute,value)
Copy after login

The example is as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("img").attr({width:"150",height:"100"});
});
});
</script>
</head>
<body>
<img src="img_pulpitrock.jpg" alt="Pulpit Rock" >
<br>
<button>给图片设置宽度和高度属性</button>
</body>
</html>
Copy after login

Output result:

Can jquery add new attributes to elements?

Video tutorial recommendation: jQuery video tutorial

The above is the detailed content of Can jquery add new attributes to elements?. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template