Comment supprimer les attributs des éléments frères et sœurs dans jquery-Questions et réponses frontales-php.cn

Comment supprimer les attributs des éléments frères et sœurs dans jquery

WBOY

Libérer： 2022-06-01 18:46:26

original

1714 Les gens l'ont consulté

Méthode : 1. Utilisez la méthode siblings() pour renvoyer tous les éléments frères de l'élément spécifié, la syntaxe est "element object.siblings()" 2. Utilisez la méthode removeAttr() pour supprimer les attributs des éléments frères. , la syntaxe est "éléments frères Object.removeAttr(property)".

Comment supprimer les attributs des éléments frères et sœurs dans jquery

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

Comment supprimer les attributs des éléments frères avec jquery

1. La méthode Obtenir les éléments frères

siblings() renvoie tous les éléments frères de l'élément sélectionné.

Les éléments frères et sœurs sont des éléments qui partagent le même élément parent.

Arbre DOM : cette méthode parcourt l'avant et l'arrière le long des éléments frères de l'élément DOM.

Astuce : veuillez utiliser la méthode prev() ou next() pour limiter la portée de la recherche uniquement à l'élément frère précédent ou à l'élément frère suivant.

Syntaxe

$(selector).siblings(filter)

Copier après la connexion

2. La méthode Supprimer les attributs de l'élément frère

removeAttr() supprime un ou plusieurs attributs de l'élément sélectionné.

Syntaxe

$(selector).removeAttr(attribute)

Copier après la connexion

Description du paramètre

attribut obligatoire. Spécifie une ou plusieurs propriétés à supprimer. Pour supprimer plusieurs propriétés, séparez les noms de propriétés par des espaces.

L'exemple est le suivant :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
.siblings *{ 
display: block;
border: 2px solid lightgrey;
color: lightgrey;
padding: 5px;
margin: 15px;
}
</style>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("li.start").siblings().removeAttr("style");
});
</script>
</head>
<body>
<div style="width:500px;" class="siblings">
<ul>ul (父节点)  
<li style="color:red">li (类名为"star"的上一个兄弟节点)</li>
<li style="color:red">li (类名为"star"的上一个兄弟节点)</li>
<li class="start">li (兄弟节点)</li>
<li style="color:red">li (类名为"star"的下一个兄弟节点)</li>
<li style="color:red">li (类名为"star"的下一个兄弟节点)</li>
</ul>   
</div>
<p>在这个例子中,我们选择类名称为“star”的li元素的所有兄弟元素。</p>
</body>
</html>

Copier après la connexion

Résultat de sortie sans ajouter l'instruction jquery :

Comment supprimer les attributs des éléments frères et sœurs dans jquery