jquery findet übergeordnete Elemente und untergeordnete Elemente (persönliche Erfahrungszusammenfassung)

Es tritt häufig auf, wenn js oder jquery zum Suchen von übergeordneten und untergeordneten Elementen verwendet wird. Bei der Verwendung kommt es jedoch immer leicht zu Verwirrung. Ich glaube, dass die Verwendung in Zukunft viel bequemer sein wird.

Hier ist die Methode, mit der jquery das übergeordnete Element nach oben findet : close() parent() parent()

Methode zum Durchsuchen untergeordneter Elemente: find()children()

js verwendet das Attribut „children[]“

html Code

Code kopieren Der Code lautet wie folgt:

jquery findet übergeordnetes Element, untergeordnetes Element >

< ;body>

p>Absatz 1 Übergeordnetes Element finden

🎜>

;
Tabelle>

mydiv">

11closest( ) Sucht bis zum nächsten Element (gibt ein jQuery-Objekt mit null oder einem Element zurück)

21parent() method

31parent("selector") method

id="sectd2">Tabelle2 finden Die td-Kinder()-Methode
] Attribut zu finden ;/td>
html>

js-Code:

Code kopieren

Der Code lautet wie folgt:

 
 

$(function(){ 
/************ Übergeordnetes Element finden *************/ 
//closest() method
$("#mytd1").bind("click",function(){ 
//alert($(this).html()); 
alert($(this).closest("table").attr("id")); /alert($(this).closest("table").html()); 

//parent() method
$("#mytd2").bind ("click",function(){ 
//alert($(this).html()); //$(this).html() ist 21 (this).attr("id") ist mytd2 
alert($(this).parent().parent().attr("id")); 
//.parent() ist tr und der zweite .parent ist tbody ist kein tbody-Tag und das dritte gefundene .parent() ist Tabelle 

//document.write("Die ID des ersten Elternteils:" $(this).parent().attr(" id" ) ". Die ID des zweiten übergeordneten Elements lautet: " $(this).parent().parent().attr("id") ". Die ID des dritten übergeordneten Elements lautet: " $(this).parent () .parent().parent().attr("id")); 

}); 

//parent("selector") parent("selector") 
$ ("#mytd3").bind("click",function(){ 
$("p").parent("#div1").css("background", "yellow"); //Das p Tag wird hier ersetzt. Ich weiß nicht, warum das Element mit this
//alert($(this).parent("#div").attr("id"));//undefiniert nicht gefunden werden kann 🎜>alert($(this).parents("div").attr("id"));//div1 achten Sie auf ein Elternteil 
}); 


/* *********** Untergeordnete Elemente finden *************/ 
//Finden Sie das td-Element von Tabelle2 find() 
$("#sectd1").bind("click",function(){ 
alert($("# table2") .find("td").length); 
/* $("#table2").find("td").each(function(index,element){ 
alert($( element).text()); function() { 
var table = $("#table2"); 
alert($("#table2").children().children().children("td[id='sectd2'] "). html()); 
//children() is tbodychildren() is tr children("td[id='sectd2']") is td 
}); 

 
 // Kinder[] von js 
$("#sectd3").bind("click",function(){ 
var table = document.getElementById("table2"); 
alert (table.children[0].children[2].children[0].innerHTML); 
//children[0] ist tbodychildren[2] ist tr in der dritten Zeilechildren[0] ist td 
}) ; 

}); 

Verwandte Etiketten：

jquery 子元素 übergeordnetes Element

Quelle：php.cn

Vorheriger Artikel：Tipps zum Festlegen des Dropdown-Felds als schreibgeschützt mithilfe von js_javascript-Tipps Nächster Artikel：Detaillierte Erläuterung der Verwendung von jquery selector_jquery

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Neueste Artikel des Autors