' για την παράγραφο, '
' για την επικεφαλίδα πρώτου επιπέδου κ.λπ. Αυτή η προσέγγιση απαιτείται όταν ο χρήστης χρειάζεται να αποκτήσει πρόσβαση σε ένα στοιχείο HTML με το όνομα της ετικέτας του απευθείας αντί για αναζήτηση πολλαπλών γραμμών κώδικα.
Αυτός ο οδηγός θα εξηγήσει την πλήρη διαδικασία για την ανάκτηση του ονόματος της ετικέτας ενός στοιχείου HTML χρησιμοποιώντας JavaScript.
Πώς να ανακτήσετε το όνομα ετικέτας ενός στοιχείου HTML χρησιμοποιώντας JavaScript;
Η JavaScript προσφέρει το 'μόνο για ανάγνωση' όνομα ετικέτας ” ιδιότητα που εμφανίζει το όνομα ετικέτας του αντίστοιχου στοιχείου HTML. Επιστρέφει μια τιμή συμβολοσειράς, δηλαδή το όνομα της ετικέτας του στοιχείου με κεφαλαία.
Σύνταξη
στοιχείο. όνομα ετικέτας
Στην παραπάνω σύνταξη, ' όνομα ετικέτας ' αντιστοιχεί στα ονόματα των ετικετών του στοιχείου που πρέπει να ληφθούν.
Τώρα, ας προχωρήσουμε στην πρακτική εφαρμογή του για να ελέγξουμε πώς μπορεί να χρησιμοποιηθεί για την ανάκτηση του ονόματος της ετικέτας του αντίστοιχου στοιχείου HTML.
Παράδειγμα: Εφαρμογή της ιδιότητας 'tagName' για την ανάκτηση του ονόματος ετικέτας ενός στοιχείου HTML
Σε αυτό το παράδειγμα, όλα τα ονόματα ετικετών του στοιχείου που καθορίζονται στον κώδικα HTML μπορούν να ανακτηθούν μέσω του ' όνομα ετικέτας ” ιδιοκτησία.
Κώδικας HTML
Ας ρίξουμε μια ματιά στον ακόλουθο κώδικα HTML:
< σώμα στο κλικ = 'elemName()' >< h2 > Λήψη ονόματος ετικέτας του στοιχείου HTML σε JavaScript < / h2 >
< Π > Κάντε κλικ σε οποιοδήποτε στοιχείο σε αυτό το έγγραφο για να λάβετε το όνομα της ετικέτας του. < / Π >
< κουμπί > Κλίκαρέ το < / κουμπί >
< Π ταυτότητα = 'διαδήλωση' >< / Π >
Στις παραπάνω γραμμές κώδικα:
- Ο ' <σώμα> Η ετικέτα ' σχετίζεται με ένα ' στο κλικ ' ανακατεύθυνση συμβάντος στη συνάρτηση JavaScript ' elemName() ' που θα ενεργοποιηθεί με ένα κλικ.
- Ο ' Η ετικέτα ορίζει την υπότιτλου.
- Ο ' Η ετικέτα ' δημιουργεί μια δήλωση παραγράφου.
- Ο ' <κουμπί> Η ετικέτα προσθέτει ένα κουμπί με το όνομα 'Κάντε κλικ'.
- Τέλος, το « Η ετικέτα ορίζει μια κενή παράγραφο με αναγνωριστικό διαδήλωση ' για να εμφανίσετε το όνομα της ετικέτας στοιχείου HTML στην ενεργοποίηση συμβάντος 'onclick'.
Κώδικας JavaScript
Στη συνέχεια, προχωρήστε στον παρακάτω κώδικα:
< γραφή >λειτουργία Όνομα στοιχείου ( ) {
συνθ στοιχείο = Εκδήλωση. στόχος ;
έγγραφο. getElementById ( 'διαδήλωση' ) . innerHTML = 'Το όνομα της ετικέτας στοιχείου HTML στο οποίο έγινε κλικ είναι: ' + στοιχείο. όνομα ετικέτας ;
}
γραφή >
Σε αυτό το μπλοκ κώδικα:
- Ορίστε μια συνάρτηση με το όνομα ' elemName() '.
- Στον ορισμό της, δηλώστε τη μεταβλητή ' στοιχείο 'τύπου δεδομένων' συνθ 'που χρησιμοποιεί το ' στόχος ιδιότητα για να επιστρέψει το όνομα του στοιχείου όταν ενεργοποιείται το συσχετισμένο συμβάν του.
- Τέλος, εφαρμόστε το « getElementById() ' μέθοδος πρόσβασης στην προστιθέμενη παράγραφο χρησιμοποιώντας το αναγνωριστικό της.
- Θα έχει ως αποτέλεσμα την εμφάνιση του ονόματος της ετικέτας του αντίστοιχου στοιχείου HTML χρησιμοποιώντας το ' όνομα ετικέτας ιδιότητα όταν θα ενεργοποιηθεί το συμβάν 'onclick'.
- Είναι τέτοιο που κάνοντας κλικ σε οποιοδήποτε από τα στοιχεία στον κώδικα HTML, θα ανακτηθεί το αντίστοιχο όνομα ετικέτας.
Παραγωγή
Η έξοδος δείχνει το αντίστοιχο όνομα ετικέτας στοιχείου όπου ενεργοποιείται ανάλογα το συμβάν 'onclick'.
συμπέρασμα
Η JavaScript παρέχει το ενσωματωμένο ' όνομα ετικέτας ιδιότητα για τη λήψη του ονόματος της ετικέτας στοιχείου HTML. Χρησιμοποιείται γενικά με χειριστές συμβάντων JavaScript όπως 'onclick', 'onmouseover', 'ondblclick' κ.λπ. Όταν ενεργοποιείται το συσχετισμένο συμβάν του στοιχείου HTML, επιστρέφει το όνομα της ετικέτας του με ΚΕΦΑΛΑΙΑ από προεπιλογή. Αυτός ο οδηγός παρέχει μια σύντομη περιγραφή του τρόπου ανάκτησης του ονόματος ετικέτας ενός στοιχείου HTML χρησιμοποιώντας JavaScript.