Javascript - Στοιχεία αναζήτησης βάσει αναγνωριστικών τους

Αυτή η συμβουλή θα σας δείξει πώς να αναζητήσετε στοιχεία βάσει του αναγνωριστικού τους. Τότε συμβαίνει μια κανονική έκφραση.

Θέμα

Γνωρίζετε ήδη τη μέθοδο getElementById (id) που χρησιμοποιείται για την επιστροφή του στοιχείου που σχετίζεται με ένα συγκεκριμένο αναγνωριστικό (δεδομένου ότι το αναγνωριστικό είναι κατ 'ανάγκη μοναδικό) και τη μέθοδο getElementsByTagName (tagName) που επιστρέφει έναν πίνακα που περιέχει όλα τα στοιχεία με την αναφερόμενη ετικέτα.

Λοιπόν υπάρχουν κάποιες περιπτώσεις όπου αυτές οι λύσεις δεν είναι αρκετές.

Για παράδειγμα: Έχετε τετράγωνα στον ιστότοπό σας: όταν ο χρήστης κάνει κλικ σε ένα κουμπί, κάθε τετράγωνο αλλάζει μέγεθος, το καθένα με νέο δικό του μέγεθος. Επομένως, θα πρέπει να έχετε μια λίστα με τα αναγνωριστικά τους για να τα διαχειριστείτε. Διατίθενται δύο λύσεις:

Κάθε φορά που προσθέτετε ένα τετράγωνο, αυξάνετε με μη αυτόματο τρόπο μια λίστα αναγνωριστικών.

Έχετε έναν βρόχο που ψάχνει το έγγραφο για να βρει τα τετράγωνα, έτσι η μέθοδος ταιριάζει άμεσα στον κώδικα. Αλλά πώς να ανακτήσετε όλα τα αναγνωριστικά, γνωρίζοντας ότι δεν γνωρίζετε τον ακριβή αριθμό τετραγώνων (χωρίς βρόχο) και δεν ξέρετε πού βρίσκονται στη σελίδα;

Λύση

Θα χρησιμοποιήσουμε τη μέθοδο getElementByRegexId. Αυτή η μέθοδος έχει δύο παραμέτρους:

Η κανονική έκφραση που ταιριάζει με τα αναγνωριστικά.

[Fac] Το όνομα της ετικέτας προς αναζήτηση. Εάν δεν αναφέρεται τίποτα, τότε λαμβάνονται υπόψη όλες οι ετικέτες.

Η αρχή είναι απλή: αναζητάμε τα στοιχεία που ανακτώνται από το getElementsByTagName, δοκιμάζουμε τα αναγνωριστικά και οτιδήποτε αντιστοιχεί στην κανονική έκφραση, προστίθεται σε έναν πίνακα:

 συνάρτηση getElementsByRegexId (regexpParam, tagParam) {// Σας αρέσει το μπαλίσκο για να μάθετε περισσότερα για το κουτί με τα μπαλάκια tagParam = (tagParam === undefined); '*': tagParam; var elementsTable = νέος πίνακας (); για (var i = 0 · i 

Παράδειγμα:

 var divCarres = getElementsByRegexId (/ _ καρέ. * /, "div"); var tousLesCarres = getElementsByRegexId (/ _ καρέ. * /); 

Προηγούμενο Άρθρο Επόμενο Άρθρο

Οι Καλύτερες Συμβουλές