Comment trouver la valeur du contenu des nœuds frères dans jquery

Étapes de mise en œuvre : 1. Utilisez la fonction qui traverse les nœuds frères (siblings(), next(), etc.) pour obtenir les nœuds frères de l'élément spécifié. La syntaxe est "spécifier l'élément. Spécifier la fonction de traversée" ; Utilisez text() ou html() La fonction obtient la valeur du contenu du nœud sélectionné, la syntaxe est "sibling node.text()" ou "sibling node.html()".

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

jquery trouve la valeur de contenu des nœuds frères et sœurs. Vous pouvez voir deux parties :

• Trouver les nœuds frères et sœurs

• Obtenir la valeur de contenu du nœud sélectionné

Étape 1. Rechercher les nœuds frères et sœurs.

jquery fournit une variété de fonctions pour obtenir des nœuds frères et sœurs, il y en a généralement sept :

• méthode siblings(), principalement utilisée pour obtenir tous les éléments frères du même niveau de l'élément spécifié

• méthode next() , principalement utilisé Utilisé pour obtenir l'élément frère suivant de l'élément spécifié

• méthode nextAll(), principalement utilisé pour obtenir tous les éléments frères de l'élément frère suivant de l'élément spécifié

• méthode nextUntil(), principalement utilisée pour obtenir l'élément frère suivant de l'élément spécifié Un élément frère doit être un élément entre l'élément spécifié et l'élément défini par la méthode nextUntil() La méthode

• prev() est principalement utilisée pour obtenir. les éléments frères de niveau supérieur de l'élément spécifié. Méthode

• prevAll(), principalement utilisée pour obtenir tous les éléments frères au niveau supérieur de l'élément spécifié. Élément frère précédent de l'élément spécifié. Cet élément frère doit être entre l'élément spécifié et la méthode prevUntil() Définissez les éléments entre les éléments

• Exemple : utilisez next() pour obtenir le nœud frère suivant de l'élément sélectionné h2.

  $("h2").next()

Étape 2. Obtenez la valeur de contenu du nœud sélectionné

Utilisez la méthode text() Définissez le contenu du texte du nœud sélectionné

• Exemple 1 : Obtenez la valeur de contenu du nœud frère suivant

  
  
  	
  		
  		
  		
  		
  	
  	
  		
  div (父)
  			
  p（兄弟元素）
  			span（兄弟元素）
  			
  h2（本元素）
  			
  h3（兄弟元素）
  			
  p（兄弟元素）
  		
  		获取兄弟节点的内容值
  	
  

Exemple 2 : Obtenez la valeur de contenu de tous les nœuds frères

$(document).ready(function() {
	$("button").click(function() {
		$("h2").siblings().css("color","red");
		var con=$("h2").siblings().text();
		console.log(con);
	});
});

Utilisez html() Définissez le contenu du nœud sélectionné (innerHTML)

• Exemple : Obtenez la valeur de contenu de le nœud frère précédent

  $(document).ready(function() {
  	$("button").click(function() {
  		$("h2").next().css("color","red");
  		var con=$("h2").next().html();
  		console.log(con);
  	});
  });

[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!