background image

Κεφάλαιο 2 - Θεωρητικό Υπόβαθρο 
 

 

 

 

20 

 

επαναπροσδιορισμός αυτών που προϋπήρχαν και είσοδος νέων. Έτσι η γλώσσα CSS3 μας δίνει 
πλέον νέες δυνατότητες  ενώ παράλληλα εισάγονται συνεχώς νέες ενότητες που οδηγούν σε  
περαιτέρω ανάπτυξη των λειτουργιών της. 

 

Οι  γλώσσες  HTML  και  CSS  μας  επιτρέπουν  την  εισαγωγή  στοιχείων  και  την 

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

 

2.1.2 JavaScript 
 

 

Η  γλώσσα  JavaScript  [14]  είναι  μια  διερμηνευμένη  γλώσσα  προγραμματισμού  που 

επιτρέπει, στα πλαίσια του προγραμματισμού διαδικτύου, την εκτέλεση προγραμμάτων μετά 
την μεταφόρτωση της σελίδα από τον χρήστη. Η ιδιότητα αυτή μας δίνει την δυνατότητα να 
προσθέσουμε μία δυναμική και διαδραστική αλληλεπίδραση του χρήστη με την ιστοσελίδα. 

 

Στην εφαρμογή που αναπτύξαμε, ο τρόπος που χρησιμοποιούμε την γλώσσα JavaScript 

είναι κυρίως χειρισμού γεγονότων.  Κατά την περιήγηση στην σελίδα ο χρήστης δημιουργεί 
διάφορα γεγονότα. Ένα γεγονός μπορεί να είναι η αποστολή μίας φόρμας ή το πέρασμα του 
δείκτη ποντικιού πάνω από ένα στοιχείο HTML. Στην εφαρμογή μας χρησιμοποιούμε τόσο το 
αρχικό όσο και το πρότυπο μοντέλο γεγονότων. Όπως περιγράφει ο συγγραφέας στο [15], το 
αρχικό μοντέλο γεγονότων μας προσφέρει αμεσότητα,  ταχύτητα και υποστηρίζεται από του 
περισσότερους  περιηγητές  ενώ  το  πρότυπο  μοντέλο  γεγονότων  μας  προσφέρει  μεγαλύτερες 
δυνατότητες  και υποστηρίζεται από τους περισσότερους σύγχρονους περιηγητές. Υπάρχουν 
δύο βασικοί τρόποι που αντιμετωπίζονται τα γεγονότα. Ο πρώτος τρόπος είναι η εκτέλεση μιας 
λειτουργίας  όπως  η  εμφάνιση  ενός  στοιχείου  HTML,  η  επιβεβαίωση  των  εισαγόμενων 
στοιχείων σε μία φόρμα ή η σχεδίαση της κυματομορφής του επιλεγμένου κύματος. Με αυτόν 
τον  τρόπο  επιτρέπουμε  στον  χρήστη  την  αξιοποίηση  λειτουργιών  και  επιβεβαιώνουμε  την 
σωστή λειτουργία τους. Ο δεύτερος τρόπος που αντιμετωπίζονται τα γεγονότα είναι με την 
χρήση  της  τεχνικής  AJAX  (Asynchronous  JavaScript  and  Extensible  Markup  Language, 
Ασύγχρονη JavaScript και Επεκτάσιμη Γλώσσα Σήμανσης). Η τεχνική αυτή πρόκειται για την 
ασύγχρονη  ανταλλαγή  δεδομένων  μεταξύ  ενός  χρήστη  και  ενός  εξυπηρετητή. 
Χρησιμοποιώντας  αυτόν  τον  τρόπο,  μπορούμε  να  αντιμετωπίσουμε  γεγονότα  όπως  η 
αποθήκευση αλλαγών σε ένα αρχείο χωρίς την ανάγκη για την αποστολή μιας φόρμας που θα 
προκαλούσε επανάληψη φόρτωσης της σελίδας με αποτέλεσμα την διακοπή συγγραφής. Με 
παρόμοιο τρόπο, η ίδια τεχνική μας επιτρέπει την ανάκτηση στοιχείων από τον εξυπηρετητή 
επιτρέποντάς  μας  για  παράδειγμα  την  άμεση  επίδειξη  αποτελεσμάτων  σε  μία  φόρμα 
αναζήτησης. Γίνεται εύκολα φανερό ότι αυτός ο τρόπος αντιμετώπισης γεγονότων μας δίνει 
την δυνατότητα να προσφέρουμε στον χρήστη μια πιο άμεση αλληλεπίδραση χωρίς περιττές 
διακοπές. 

 

Με  την  παρουσίαση  της  γλώσσας  JavaScript  ολοκληρώνουμε  την  παρουσίαση  των 

βασικών εργαλείων που χρησιμοποιούμε στην πλευρά του χρήστη. Οι γλώσσες HTML και CSS 
παρουσιάζουν  τα  στοιχεία  αλληλεπίδρασης  και  η  γλώσσα  JavaScript  προσθέτει  δυναμικές 
λειτουργίες σε αυτά. Έτσι δημιουργούμε την συνολική διεπαφή που προσφέρεται στον χρήστη.