PARTEA A TREIA
33. Lucrul cu site-uri
elemente DOM
- nodeList se opune;
- proprietăți acces elemente;
- metode de acces la elementele;
- Unele metode de creare a elementelor.
Atunci când se lucrează cu HTML, am întâlnit diverse colecții: document.images. document.links. document.all etc. Aceste colecții nu aparțin DOM 3 interfață și sunt un fel de „throwback“ rămase din DOM 0.
De ce desenez asta atentia?
Amestecarea acestor concepte poate duce la un non-de lucru sau „curbe“ script-uri.
Avantajul utilizării DOM 3 care ne putem crea orice colecție # 151; cât de relevante și non-relevante integrate.
nodeList obiect
Fiecare element este un obiect nodeList nod - obiect având un număr de proprietăți.
Se poate imagina nodeList ca un hash. De exemplu, în lista de atribute poate fi văzută ca o serie de „chei“ (nume de atribute :. Align culoare, etc) și „valoare“ (valori atribut :. Center negru, etc.)
În unele cazuri, pentru a lucra cu conținutul obiectului nodeList este convenabil pentru a converti conținutul în matrici regulate. De exemplu, vrem să obțineți o serie de toate tag-urile care sunt în
.ChildNodes element de proprietate
returnează o listă cu toate nodurile sale copil.Set "filtru" care selectează doar un singur element de noduri (nodeType == 1).
Construiți o matrice ce conține numele tag (nodeName).
allBodyTags var = new Array;
var elmBody = document.getElementsByTagName ( "BODY") [0];
pentru (var i = 0; i
// dacă tipul de nod - element de
if (elmBody.childNodes [i] .nodeType == 1)
<
// vom crește matrice de retur
// nume de elemente
allBodyTags = allBodyTags.concat (elmBody.childNodes [i] .nodeName);
>
>
Proprietăți pentru a avea acces la elemente
Proprietăți discutate mai jos sunt doar elementelor DOM. In HTML, ele sunt interpretate cu ajutorul tag-uri.
(Încă o dată, vă reamintesc că acest lucru nu este sinonim Dacă vom compara elementul cu o bandă de alergare, apoi etichetează -. Este începutul și sfârșitul în elementele care nu au o etichetă de închidere, conceptele sunt aceleași ..)
Unele dintre aceste proprietăți sunt disponibile pentru nodurile de text, dar vorbesc despre asta într-o secțiune specială.
Fiecare element are proprietăți care să reflecte locația sa în ierarhia DOM. Acestea vă permit să naviga prin toate elementele copacului. Iată câteva proprietăți ale elementelor relației:
Returnează elementul părinte. Pe schema noastră pentru site-ul HTML elementul părinte este documentul în sine, pentru cap și corp - nod HTML, etc.
Nodurile text sprijină, de asemenea, această caracteristică.
În nodul de document, desigur, această caracteristică nu este prezent.
investiții posibile de tip „matroshechnogo“ de acces la „bunicul“ sau „străbunicul“:
Lista de descendenți ai nodului (Nodelist obiect). Atunci când se lucrează cu HTML, această funcție este utilă doar pentru elementele. Nodurile text și nodurile de atribut nu au copii.
Nod - un nod părinte.
N - numărul de urmași în listă.
Browsere de familie Netscape percep lacune în codul (linii goale sau trecerea la o altă linie), ca noduri de text.
În acest exemplu, un document simplu:
Nodul are un singur document copil: elementul „html“.
Elementul „html“ ideea are doi descendenți: element de „cap“ și element de „corp“. Dar, în browserele Netscape de familie a oricărui copil de 4: rupe linia înainte
. cum se cuvine . line înainte de pauză și de fapt . Acest lucru ar trebui să fie amintit, uita la o listă de childNodes în bucla pentru.În natură, ca și în cazul în care există o metodă normalize (). care ar trebui să rezolve problema, dar elementele HTML nu reacționează la ea. Prin urmare, eu pot oferi doar „artizanală“ cale.
Această metodă are un dezavantaj: exclude din circulație toate nodurile de text, nu doar „stânga“. Desi e ca sa vezi: poate face de lucru util, de compensare grâul de neghină, și să dea o separare mai clară a elementelor și nodurile de text.
«# 133; huligani normale merg întotdeauna în jurul valorii de“
De ce să construiască o serie de nume de numele elementelor (nodeName)?
NodeType pentru că toate au o unitate, și nodeValue. După cum ne amintim, - nul. O proprietate este lungimea corectă, punctul de vedere normalizat.
Există un alt mod de a scăpa de această eroare artizanală: doar scrie tot codul HTML pe o singură linie lungă.
Pointeri la elementele corespunzătoare din lista childNodes (a se vedea. Tabelul de mai sus).
.firstChild elementul - la fel ca .childNodes [0].
Element .lastChild - la fel ca element de .childNodes [.childNodes.length-membru 1].
Consultați elementul părinte care are o „familie» childNodes.
Aceste indicii sunt de cotitură deja să se „membri ai familiei» childNodes.
Firește, că childNodes [0] off prevSibling,
în timp ce childNodes [childNodes.length-1] este inutil să se uite nextSibling.
Familia browser-ul Netscape pe motivul de mai sus, câteva noduri mai mult decât aveți nevoie. Prin urmare, utilizați aceste proprietăți nu este întotdeauna convenabil.
Metode de acces la elementele
În această lecție privire de ansamblu ne vom uita la câteva metode de bază de acces la elementele. Primul grup de metode aparține documentului obiect rădăcină. unele dintre care le-am folosit deja.
Metodele de al doilea grup poate fi aplicat elementelor înseși.
metoda documentului obiect
Prin această metodă ne-am bucurat deja. El se referă la elementul cu ID-ul, specificat ca argument (nu uitați să setați ID-ul atunci când pagina vorstke).
Metoda pentru toate elementele
Returnează o listă de elemente copil specificate în argumentul numelui unei etichete.
Fiți atenți la ortografia numelui metodei
O parte din «elemente» este scris la plural, cu bukovkoy «i» în cele din urmă.
Element - orice element DOM.
Dacă argumentul parametrului conține un asterisc, returnează o listă a tuturor elementelor de copil.
Această metodă poate fi aplicată documentului însuși, sau la orice element. De exemplu, acesta poate fi aplicat elementului