Comment modifier la valeur d'attribut de div dans jquery-Questions et réponses frontales-php.cn

Comment modifier la valeur d'attribut de div dans jquery

青灯夜游

Libérer： 2022-06-10 15:40:37

original

3056 Les gens l'ont consulté

Deux méthodes pour modifier la valeur de l'attribut : 1. Utilisez attr() pour modifier la valeur de l'attribut, la syntaxe "$("div").attr("Nom de l'attribut", "Nouvelle valeur d'attribut");" ("div ").attr({Attribut 1 : "Nouvelle valeur", Attribut 2 : "Nouvelle valeur"....});". 2. Utilisez prop() pour modifier la valeur de l'attribut, la syntaxe est "$("div").prop("property name","new value");" ou "$("div").prop({property 1:"nouvelle valeur",Attribut2:"Nouvelle valeur"...});".

Comment modifier la valeur d'attribut de div dans jquery

L'environnement d'exploitation de ce tutoriel : système windows7, version jquery3.6.0, ordinateur Dell G3.

Deux façons de modifier la valeur de l'attribut div avec jquery

Méthode 1 : Utilisez attr() pour modifier la valeur de l'attribut

Syntaxe de modification :

//单个属性
$("div").attr("属性名","新属性值");

//多个个属性
$("div").attr({属性1:"新值",属性2:"新值"....});

Copier après la connexion

Exemple : Modifier la valeur de l'attribut de style

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script>
		$(document).ready(function() {
			$("button").click(function() {
				$("div").attr("style","height:100px;background-color: #AFEEEE;");
			});
		});
		</script>
	</head>
	<body>

		<div style="height: 150px;border: 1px solid red;"></div>
		<br>
		<button>修改div的属性值</button>
	</body>
</html>

Copier après la connexion

Comment modifier la valeur dattribut de div dans jquery

Méthode 2 : Utiliser prop() pour modifier les valeurs d'attribut

Modifier la syntaxe :

//单个属性
$("div").prop("属性名","新值");
//多个个属性
$("div").prop({属性1:"新值",属性2:"新值"....});

Copier après la connexion

Exemple : Modifier l'attribut de classe

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<script src="./js/jquery-3.6.0.min.js"></script>
		<script>
		$(document).ready(function() {
			$("button").click(function() {
				$("div").attr("class","box2");
			});
		});
		</script>
		<style>
			.box1{
				height: 150px;
				background-color: #AFEEEE;
			}
			.box2{
				height: 100px;
				background-color: red;
			}
		</style>
	</head>
	<body>

		<div class="box1"></div>
		<br>
		<button>修改div的属性值</button>
	</body>
</html>

Copier après la connexion

Comment modifier la valeur dattribut de div dans jquery