Maison > Article > interface Web > Comment modifier l'attribut caché dans jquery
Comment modifier l'attribut caché dans jquery
- 青灯夜游original
- 2022-03-11 15:45:543325parcourir
Méthode : 1. Utilisez attr(), la syntaxe est "element object.attr("hidden", value)" ; 2. Utilisez prop(), la syntaxe est "element object.prop("hidden", value) "; 3. Utilisez removeAttr(), la syntaxe est "element.removeAttr("hidden")".
L'environnement d'exploitation de ce tutoriel : système windows7, version jquery1.10.2, ordinateur Dell G3. L'attribut
hidden spécifie que l'élément est masqué. Les éléments masqués ne seront pas affichés. Si cet attribut est utilisé, l'élément sera masqué.
jquery pour modifier l'attribut caché
1 Utilisez l'attribut attr() pour définir la valeur de l'attribut caché
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function(){
$("div").attr("hidden",false);
});
});
</script>
</head>
<body>
<p>测试文字-p元素</p>
<div hidden>测试文字-div元素</div>
<p>测试文字-p元素</p>
<button>修改hidden属性 </button>
</body>
</html>
2. valeur de l'attribut caché
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function(){
$("div").prop("hidden",false);
});
});
</script>
</head>
<body>
<p>测试文字-p元素</p>
<div hidden>测试文字-div元素</div>
<p>测试文字-p元素</p>
<button>修改hidden属性 </button>
</body>
</html>Exécuter L'effet est le même que celui de la méthode 1
3 Utilisez l'attribut removeAttr() pour supprimer l'attribut caché
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="js/jquery-1.10.2.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function(){
$("div").removeAttr("hidden");
});
});
</script>
</head>
<body>
<p>测试文字-p元素</p>
<div hidden>测试文字-div元素</div>
<p>测试文字-p元素</p>
<button>修改hidden属性 </button>
</body>
</html>L'effet d'exécution est le même que celui de la méthode 1
[. Apprentissage recommandé : Tutoriel vidéo jQuery, Vidéo web front-end]
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!