jQuery Succinctly jQuery Manipulation

Crearea, operarea și adăugarea HTML pe zbor

Puteți crea marcaj HTML în zbor prin trecerea funcției jQuery un șir de cod HTML brut.

       

Este important să rețineți că atunci când creați structuri DOM utilizând funcția jQuery, numai elementele rădăcinii din structură sunt adăugate la setul de învelitori. În exemplul anterior al codului,

Elementele vor fi singurele elemente din setul de învelitori.

Putem folosi găsi() metoda de a opera pe orice element din structura HTML după crearea acesteia.

       

După ce operează pe noul HTML creat, este posibil să îl adăugați și în DOM utilizând una dintre metodele de manipulare ale jQuery. Mai jos folosim adăuga la() pentru a adăuga marcajul la pagină.

       

Note: Elemente simple care nu conțin atribute - de ex. $ (“

„) - sunt create prin document.createElement Metoda DOM, în timp ce toate celelalte cazuri se bazează pe innerHTML proprietate. De fapt, puteți trece direct funcția jQuery cu care a fost creat un element document.createElement -de exemplu. $ (Document.createElement ( 'div')).

Șirul HTML transferat către jQuery nu poate conține elemente care ar putea fi considerate nevalide în interiorul unui

element.

Șirul HTML transmis funcției jQuery trebuie să fie bine format.

Ar trebui să deschideți și să închideți toate elementele HTML atunci când treceți jQuery HTML. Fără a face acest lucru ar putea duce la bug-uri, mai ales în Internet Explorer. Pentru a fi în siguranță, închideți întotdeauna elementele HTML și evitați scrierea codului HTML rapid - de ex. $ (

).


Grokking index () Metoda

Puteți determina indicele unui element din setul de înveliș, trecând acel element la index() metodă. De exemplu, să presupunem că aveți un set de învelitori care conține toate

elemente dintr-o pagină Web și doriți să cunoașteți indexul ultimei
element.

    
0
1
2
3

Utilizarea index() nu ajunge într-adevăr în casă până nu ne gândim cum poate fi folosit cu evenimente. De exemplu, făcând clic pe

elemente din codul de mai jos, putem trece clicul
element (utilizând cuvântul cheie acest) la index() metoda de determinare a clicului
indicele.

    
text nav
text nav
text nav
text nav

Grokking text () Metoda

S - ar putea presupune incorect că text() metoda returnează numai nodul text al primului element într-un set de învelitori. Cu toate acestea, ea se va alătura de fapt nodurilor de text ale tuturor elementelor conținute într-un set de înfășurare și apoi va returna valoarea concatenată ca un singur șir. Asigurați-vă că sunteți conștient de această funcție sau că puteți obține unele rezultate neașteptate.

    
1,
2,
3,
4

Actualizați sau eliminați caracterele utilizând o expresie regulată

Utilizarea JavaScript a inlocui() metoda combinată cu unele funcționalități jQuery, putem foarte ușor să actualizăm sau să eliminăm orice tip de caractere din textul conținut într-un element.

    

Chiar urăsc folosind JavaScript. Adică mă urăsc! Este cel mai bun twister vreodată!

De asemenea, puteți să actualizați orice caractere care sunt conținute într-un șir returnat de la html (). Aceasta înseamnă că nu puteți numai să actualizați textul, ci și să actualizați și să înlocuiți elementele DOM printr-o expresie regulată.


Grokking metoda .contents ()

.cuprins() metoda poate fi utilizată pentru a găsi toate nodurile elementului copil, inclusiv nodurile de text conținute în interiorul unui element. Cu toate acestea, există o captură. Dacă conținutul preluat conține numai noduri text, selecția va fi plasată în interiorul setului de wrapper ca nod de text unic. Cu toate acestea, dacă conținutul pe care îl preluați are unul sau mai multe noduri de elemente printre nodurile text, atunci .cuprins() metoda va conține noduri de text și noduri de elemente. Examinați codul de mai jos pentru a înțelege acest concept.

    

Îmi place să folosesc jQuery!

iubesc într-adevăr folosind jQuery!

Observați că atunci când un element din setul de învelitori este un nod text, trebuie să extragem valoarea utilizând .get (0) .nodeValue. cuprins() este utilă pentru extragerea valorilor nodului text. Este posibil să extrageți numai nodurile de text dintr-o structură DOM utilizând cuprins().

    

jQuery mă dă Mai Mult putere decât orice alt instrument web!


Utilizarea ștergerii () nu elimină elementele din setul de înfășurare

Când utilizați elimina(), un fragment DOM de la DOM elementele conținute în structura DOM eliminat sunt încă incluse în setul de învelitori. Ați putea să eliminați un element, să acționați asupra acelui element și apoi să plasați acest element înapoi în DOM, toate într-un singur lanț jQuery.

    
indeparteaza-ma

Ideea este că doar pentru că tu elimina() elemente nu înseamnă că sunt eliminate din setul de împachetare jQuery.

Cod