Εισαγωγή στο jQuery

Η βιβλιοθήκη jQuery μπορεί να προστεθεί στον ιστότοπο με μια απλή σημαία.

Χαρακτηριστικές της βιβλιοθήκης jQuery

Η jQuery είναι μια βιβλιοθήκη JavaScript.

Η βιβλιοθήκη jQuery περιέχει τις παρακάτω χαρακτηριστικές ιδιότητες:

  • Επιλογή στοιχείων HTML
  • Επεξεργασία στοιχείων HTML
  • Επεξεργασία CSS
  • Συνάρτηση συμβάντων HTML
  • Εφέ και анимάσεις JavaScript
  • Περιήγηση και τροποποίηση του HTML DOM
  • AJAX
  • Χρησιμότητες

Προσθέστε τη βιβλιοθήκη jQuery στη σελίδα σας

Η βιβλιοθήκη jQuery βρίσκεται σε ένα αρχείο JavaScript όπου περιέχει όλες τις λειτουργίες της jQuery.

Το jQuery μπορεί να προστεθεί στη σελίδα σας με την παρακάτω σήμανση:

<head>
<script type="text/javascript" src="jquery.js"></script>
</head>

Λάβετε υπόψη ότι η ετικέτα <script> πρέπει να βρίσκεται στην ενότητα <head> της σελίδας.

Παράδειγμα βασικού jQuery

Το παρακάτω παράδειγμα δείχνει τη συνάρτηση hide() του jQuery, η οποία κρύβει όλα τα στοιχεία <p> του HTML έγγραφου.

Παράδειγμα

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
$("button").click(function(){
$("p").hide();
});
});
</script>
</head>
<body>
<h2>Αυτό είναι ένας τίτλος</h2>
<p>Αυτό είναι ένας παράγραφος.</p>
<p>Αυτό είναι ένας άλλος παράγραφος.</p>
<button type="button">Κάνε κλικ εδώ</button>
</body>
</html>

Προσπαθήστε το προσωπικά

Λήψη jQuery

Υπάρχουν δύο εκδόσεις του jQuery διαθέσιμες για λήψη: η μια είναι συμπιεσμένη και η άλλη δεν είναι (για αποσφαλμάτωση ή ανάγνωση).

Και οι δύο εκδόσεις είναι διαθέσιμες jQuery.com Λήψη

Αντικατάσταση βιβλιοθήκης

Το Google και το Microsoft υποστηρίζουν καλά το jQuery.

Αν δεν θέλετε να αποθηκεύσετε τη βιβλιοθήκη jQuery στον υπολογιστή σας, μπορείτε να την φορτώσετε από το CDN του Google ή του Microsoft.

Χρήση του CDN του Google

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
</head>

Χρήση του CDN του Microsoft

<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery
/jquery-1.4.min.js"></script>
</head>