Πως να βρείτε ότι θέλετε με το jQuery

11 Μαρ 2010 | JavaScript

Δεν επιτρέπονται τα σχόλια.


jQuery

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

Για την άσκηση αυτή έχω βάλει μαζί μια μικρή παράγραφο και μία ταξινομημένη λίστα με διάσπαρτα αντικείμενα μέσα σε αυτά τα στοιχεία όπως για παράδειγμα <em>, <code>, και συνδέσμους. Όλα τα παραπάνω είναι μέσα σε ένα <div> με το ID “jqdt”, που μου επιτρέπει να συγκεντρώσω το παράδειγμα σε ένα μόνο μέρος αυτής της σελίδας

Κάθε κουμπί μετά την περιοχή του DIV “jqdt” θα φωτίσει με κίτρινο χρώμα τα αντικείμενα που βρίσκει το jQuery.

Αυτή είναι μια παράγραφος κειμένου με κλάση class=»goofy». Έχει ένα σύνδεσμο προς άλλη ιστοσελίδα, μερικά $(code), και ένα σύνδεσμο προς την ίδια σελίδα.

  1. 1o στοιχείο της λίστας silly
  2. 2o στοιχείο της λίστας με κλάση class=”goofy
  3. 3o στοιχείο της λίστας ΈΚΠΛΗΞΗ!
  4. 4o στοιχείο της λίστας με ένα σύνδεσμο σε PDF silly
  •         $('li:eq(0)')

    Εντοπίζει το πρώτο στοιχείο της λίστας

  •         $('li:even')
        

    Εντοπίζει όλα τα στοιχεία της λίστας με μονή αρίθμηση (αυτό συμβαίνει επειδή στη JavaScript η αρίθμηση στους πίνακες ξεκινά από το 0 και όχι από το 1)

  •         $('li:lt(3)')

    Εντοπίζει μόνο τα τρία πρώτα στοιχεία της λίστας. Το «lt» σημαίνει λιγότερο από «least than».

  •         $('li:not(.goofy)')

    Εντοπίζει τα στοιχεία της λίστας 1, 2 και 4 γιατί δεν έχουν την κλάση «goofy»

  •         $('p a[href*=#]')

    Εντοπίζει όλους τους συνδέσμους που είναι μέσα σε μια παράγραφο και έχουν μια ιδιότητα href με # μέσα. Παρατηρήστε επίσης το κενό ανάμεσα στο p και το a που σημαίνει πως το a είναι μέσα στο p.

  •         $('code, li.goofy')

    Εντοπίζει όλες τις ετικέτες και κάθε στοιχείο της λίστας με κλάση "goofy"

  •         $('ol .goofy > strong')

    Εντοπίζει όλες τις ετικέτες που είναι απόγονοι κάθε αντικειμένου με κλάση «goofy» και όπου η κλάση «goofy» ορίζετε αποκλειστικά μέσα στην λίστα μας.

  •         $('li + li > a[href$=pdf]')

    Εντοπίζει όλους τους συνδέσμους που λήγουν σε pdf που είναι απόγονοι κάποιου αντικειμένου της λίστας


  •  

            $('span:hidden')

    Εντοπίζει κάθε στοιχείο που είναι κρυφό

Περισσότερα για τον CorfuGmr

CorfuGmr

Ονομάζομαι Νίκος και ασχολούμαι με το internet και την κατασκευή ιστοσελίδων από το 1998. Σήμερα, μετά από 12 χρόνια γεμάτα με ενημέρωση, εκπαίδευση και εξάσκηση έχω ανεβάσει σε ένα άλλο επίπεδο τις γνώσεις μου και τις τεχνικές μου. Στα άρθρα μου προσπαθώ να σας δείξω τα μικρά, αλλά σημαντικά πράγματα που με έχουν ανεβάσει σε αυτό το επίπεδο.








Σχόλια

Δεν υπάρχουν σχόλια ακόμα.

Συγνώμη, τα σχόλια για αυτό το άρθρο είναι κλειστά.



^
Top
css.php