Partager la différence entre parent et parents dans jquery-js tutoriel-php.cn

Partager la différence entre parent et parents dans jquery

黄舟

Libérer： 2017-06-23 15:32:48

original

1660 Les gens l'ont consulté

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>

Copier après la connexion

$('p').parent() obtient p2, p3, p4
$('p').parent(' .a') obtient p3
$('p').parent().parent() obtient p1, ce qui est plutôt étrange mais Jquery ObjectLes 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>

Copier après la connexion

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>

Copier après la connexion

$( " p").parent() obtient : HelloHello 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>

Copier après la connexion

$("a").parent() obtiendra l'objet parent

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

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

Copier après la connexion

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!