As an example:
Copy Code code as follows:
<body>
<div id= "One" >
<div id= "Two" >hello</div>
<div id= "three" >
<p>
<a href= "#" >tonsh</a>
</p>
</div>
</div>
$ ("a"). Parent () will get the parental object <p>
$ ("a"). Parents () Get the parent object <p><div.3><div.1>
$ ("a"). Parents (). Filter ("div") will get <div.3><div.1>, and can also be written as $ ("a"). Parents ("div").
If you want to <div.2> objects can be written like this: $ ("a"). Parents ("Div:eq (0)").
What if you click on the <a> link to eject the contents of <div.2>?
Copy Code code as follows:
var id=$ ("a"). Parents ("Div:eq (1)"). Children ("Div:eq (0)"). html ();
alert (ID);
This kind of subscript is easy to get what we want, as long as we don't confuse the order of these subscripts.
jquery Parents use examples
<! DOCTYPE html> <ptml> <pead> <style> p, Div, span {margin:2px; padding:1px;} div {border:2px white solid;} span {cursor:pointer; font-size:12px;} . Selected {Color:blue} b {color:red; display:block; font-size:14px;} </style> <script src= "Http://code.jquery.com/jquery-latest.min.js" ></script> </pead> < body> <p> <div> <div> <span>Hello</span> </div> <span>hello again</s pan> </div> <div> <span>and Hello again</span> </div> </p> <b> click Hellos to Toggle parent Element </b> Material download Webmaster Tools Server Software Baidu Cloud Habitat Community <script> function showparents () {$ ("div"). CSS ("Border-color", "whit E "); var len = $ ("span.selected"). Parents ("div"). CSS ("Border", "2px red Solid"). Length; $ ("B"). Text ("Unique div parents:" + len); $ ("span"). Click (function () {$ (this). Toggleclass ("selected"); Showparents (); }); </script> </BODY> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]