Jak najít dítě elementu HTML v jQuery

Prvky HTML zahrnují libovolnou část webové stránky, jako jsou hlavičky, tabulky, obrázky a odstavce. Když prokládáte proměnné HTML do sebe, vytvoříte nadřazené a podřízené prvky. Horní prvek je otec, zatímco všechny prokládané prvky se stávají dětmi. V jQuery můžete získat dítě elementu pomocí funkce "děti ()" (syn, v angličtině), ale musíte projít řadou hodnot, které funkce vytváří.

Zkontrolujte, zda kód obsahuje odkaz na knihovnu jQuery dříve, než se pokusíte provést skript v jQuery. Přidejte tento kód do proměnných (záhlaví) vaší webové stránky, pokud odkaz neuvidíte:

Přidejte několik skriptových proměnných pod referenční knihovnu jQuery a napište funkci, abyste zkontrolovali, zda se stránka dokončila. Celý váš skript by měl být mezi klíči této funkce:

$ (funkce () {});

Vyberte element HTML, který potřebujete k získání seznamu podřízených prvků. Chcete-li například dostat děti z neřízeného seznamu, vyberte prvek "ul". Připojte volič funkcí "děti ()" pro získání dítěte:

$ ('ul.level-2'), děti ();

Předchozí příklad zvolí jakýkoli neřízený seznam, který má název třídy "úroveň-2". Když však děti () naleznou více podřízených prvků, vytvoří pole hodnot. Ke zpracování matice budete potřebovat speciální kódy.

Přidejte "děti ()" s "each ()" (každý) pro pohyb po poli podřízených prvků. Vzhledem k tomu, že jde o smyčkovou strukturu, potřebujete proměnnou čítače, ale v jQuery byste ji neměli předem vytvořit. Projděte "i" jako argument v každém "each ()", abyste získali svůj pult:

$ ('ul.level-2'), děti (), každá (funkce (i) {});

Deklarujte proměnnou, která zachová textovou hodnotu každého podřízeného prvku. Můžete získat další hodnoty prvků, ale text vrátí jakýkoli text nalezený uvnitř dítěte a je užitečné získat data. Nastavte proměnnou na hodnotu "$ (this)" (tato), abyste získali aktuální prvek, který funkce "each ()" pracuje. Připojte "$ (this)" "text ()" text:

var childEl = $ (tento) .text ();

Vypusťte hodnoty na stránce výběrem prvku a připojte "append ()" (příloha) tak, aby funkce "each ()" mohla pokračovat v přidávání hodnot, které najde:

$ ('div'). připojit (i + ":" + childEl + "");

V tomto příkladu je "childEl" vydáno pro řadu proměnných "". Pokaždé, když jQuery opakuje kódy v rámci "each ()", vydá číslo z "i", přidá pár středník, vyvede hodnotu "childEl" a ukončí řádek s proměnnou skriptu.

Váš závěrečný skript by měl vypadat takto:

$ () () () {$ ('ul.level-2'), děti (), každá (funkce (i) {var childEl = $ (this) .html + ":" + childEl + "");});});

Rada

Přidat "console.log (childEl);" uvnitř každé funkce "each ()" v posledním řádku. Pomocí aplikace Firebug v prohlížeči Firefox nebo konzole JavaScript v prohlížeči Google Chrome můžete zkontrolovat hodnoty v konzoli při ladění.

Nahraďte "text ()" znakem "html ()", abyste získali kód HTML podřízených prvků.