JavaScript HTML DOM Συνθέσεις

Η αντικειμενικότητα HTMLCollection

getElementsByTagName() Η μεθόδος επιστρέφει HTMLCollection Όνειρο.

Η αντικειμενικότητα HTMLCollection είναι μια λίστα των στοιχείων (συλλογή) που μοιάζει με τα μαθηματικά.

Το παρακάτω κώδικας επιλέγει όλα τα στοιχεία <p> του έγγραφου:

Παράδειγμα

var x = document.getElementsByTagName("p");

Τα στοιχεία της συλλογής μπορούν να προσβληθούν μέσω της ένδειξης.

Για να επισκεφτείτε το δεύτερο στοιχείο <p>, μπορείτε να γράψετε ως εξής:

y = x[1];

Προσπαθήστε να το δοκιμάσετε!

Σημείωση:Η αρχική ένδειξη ξεκινά από το 0.

Μέγεθος HTMLCollection

length Η ιδιότητα καθορίζει τον αριθμό των στοιχείων στην HTMLCollection:

Παράδειγμα

var myCollection = document.getElementsByTagName("p");
document.getElementById("demo").innerHTML = myCollection.length;

Προσπαθήστε να το δοκιμάσετε!

Παράδειγμα ερμηνείας:

  • Δημιουργία συλλογής όλων των στοιχείων <p>:
  • Εμφανίζει τη διάσταση της συλλογής

length Η ιδιότητα είναι χρήσιμη όταν χρειάζεστε να περιηγηθείτε στα στοιχεία της συλλογής:

Παράδειγμα

Αλλάξτε το χρώμα του παρασκηνίου όλων των στοιχείων <p>:

var myCollection = document.getElementsByTagName("p");
var i;
for (i = 0; i < myCollection.length; i++) {
    myCollection[i].style.backgroundColor = "red";
}

Προσπαθήστε να το δοκιμάσετε!

Η HTMLCollection δεν είναι λίστα!

Η HTMLCollection φαίνεται σαν λίστα, αλλά δεν είναι λίστα.

Μπορείτε να περιηγηθείτε στη λίστα και να αναφέρετε στοιχεία με αριθμητική αναφορά (όπως σε μια λίστα).

Ωστόσο, δεν μπορείτε να χρησιμοποιήσετε μεθόδους αριθμητικών στοιχείων για HTMLCollection, όπως valueOf()、pop()、push() ή join().