recherche

Maison >interface Web >js tutoriel >Partager la différence entre parent et parents dans jquery

Partager la différence entre parent et parents dans jquery

黄舟
黄舟original
2017-06-23 15:32:481651parcourir

On peut voir que la valeur de parent est très claire, qui est l'élément parent de l'élément actuel ; parents est l'élément ancêtre de l'élément actuel ; Des exemples sont répertoriés ci-dessous : 

<p id=&#39;p1&#39;>
<p id=&#39;p2&#39;><p></p></p>
<p id=&#39;p3&#39; class=&#39;a&#39;><p></p></p>
<p id=&#39;p4&#39;><p></p></p>
</p>


$('p').parent() obtient p2, p3, p4
$('p').parent(' .a') obtient p3
$('p').parent().parent() obtient p1, ce qui est plutôt étrange mais JqueryObjectLes caractéristiques de lui-même déterminent que c'est le cas ; possible.
$('p').parents() obtient p1, p2, p3, p4
$('p').parents('.a') obtient p3
parent (exp) Utilisation : Obtenir un ensemble d'éléments contenant l'élément parent unique de tous les éléments correspondants. 

<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript"> 
$(document).ready(function() {
$("#btn1").click(function(){
alert($(this).parent().next().html());
});
});
</script> 
</head> 
<body> 
<table>
<tr>
      <td><input id="btn1"  class="btn" type="button"  value="test" /></td>
      <td>some text</td>
</tr>
</table>

Parmi eux :
this.parent() est le td devant l'entrée
this.parent().parent() obtient tr
this.parent() .parent ().parent() obtient table
this.parent().next() obtient td
adjacent à td Dans l'exemple : 

<p><p>Hello</p><p>Hello</p></p>

$( " p").parent() obtient : e388a4556c0f65e1904146cc1a846beee388a4556c0f65e1904146cc1a846beeHello94b3e26ee717c64999d7867364b1b4a3e388a4556c0f65e1904146cc1a846beeHello94b3e26ee717c64999d7867364b1b4a394b3e26ee717c64999d7867364b1b4a3 objet, car la balise parent de la balise p est p

Utilisation des parents de jquery()

J'ai rencontré un problème intéressant aujourd'hui. jquery a deux fonctions parent() et parents() Grâce à ces deux fonctions, un objet peut être trouvé L'objet parent. , également connu sous le nom de sélecteur jquery. Par exemple : 

<body>
<div id="one">
<div id="two">hello</div>
<div id="three">
<p>
<a href="#">tonsh</a>
</p>
</div>
</div>

$("a").parent() obtiendra l'objet parente388a4556c0f65e1904146cc1a846bee
$("a").parents() obtiendra l'objet parent comme01ffcd5d1a840d2341909ced6bafa76cdc0c0bf950c16358990a944092168089dd1ad21d926ab3d81e0b74863b822d1b
$("a").parents().filter("div") obtiendradc0c0bf950c16358990a944092168089dd1ad21d926ab3d81e0b74863b822d1b, il peut également être écrit sous la forme $("a").parents("div").
Si vous voulez l'objet 0d2b8ff6d648b89a944975f20a7117fa, vous pouvez l'écrire comme ceci : $("a").parents("div:eq(0)").
Que dois-je faire si le contenu de 0d2b8ff6d648b89a944975f20a7117fa apparaît lorsque je clique sur le lien 3499910bf9dac5ae3c52d5ede7383485 

var id=$("a").parents("div:eq(1)").children("div:eq(0)").html(); 
alert(id);


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!

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：La différence entre l'entrée du sélecteur jQuery et :inputArticle suivant：La différence entre l'entrée du sélecteur jQuery et :input

Articles Liés

Voir plus