Κοινή χρήση τεχνολογίας

Τι είναι το AJAX; Εγγενής μορφή σύνταξης; Ποια είναι η διαφορά μεταξύ του jQuery που παρέχει συσκευασμένο AJAX;

2024-07-12

한어Русский языкEnglishFrançaisIndonesianSanskrit日本語DeutschPortuguêsΕλληνικάespañolItalianoSuomalainenLatina

Αϊάς πλήρες όνομα Ασύγχρονη JavaScript και XML (ασύγχρονος JavaScript και XML) 

ΑΪΑΣΕίναι μια τεχνολογία ανάπτυξης ιστού για τη δημιουργία διαδραστικών εφαρμογών ιστού.Η πιο βασική εξάρτηση είναι το αντικείμενο XMLHttpRequest που παρέχεται από το πρόγραμμα περιήγησης. Αυτό το αντικείμενο επιτρέπει στο πρόγραμμα περιήγησης να εκδίδει HTTP Ζητήστε και λάβετε HTTP απάντηση. Επιτύχετε αλληλεπίδραση με τον διακομιστή χωρίς ανανέωση της σελίδας.

Εγγενής μορφή σύνταξης AJAX:

  1. let xhr = new XMLHttpRequest();
  2. xhr.open('get','js/index.json',true);
  3. xhr.send();
  4. xhr.onreadystatechange = function() {
  5. if (xhr.readyState == 4 && xhr.status == 200) {
  6. let text = xhr.responseText;
  7. console.log(text);
  8. let data = JSON.parse(text);
  9. console.log(data);
  10. }
  11. };
Πώς να χρησιμοποιήσετε το ajax:
1. Δημιουργήστε αντικείμενο XMLHttpRequest
2. Χρησιμοποιήστε την ανοιχτή μέθοδο για να καθορίσετε τη διεύθυνση, τον τύπο και τη μέθοδο που θα ζητηθεί.
3. Χρησιμοποιήστε τη μέθοδο αποστολής για να στείλετε το αίτημα Εάν θέλετε να περάσετε παραμέτρους:
Η μέθοδος λήψης απαιτεί τη σύνδεση των παραμέτρων στο τέλος της διεύθυνσης URL και τον διαχωρισμό των παραμέτρων. Παράδειγμα: 'index.php?name=张三&age=18'
Η μέθοδος post μπορεί να βάλει παραμέτρους στη send(). Παράδειγμα: send('name=张三&age=18')
4. Συνδέστε το συμβάν onreadystatechange για να προσδιορίσετε την κατάσταση της ετοιμότητας και της κατάστασης.
5. Λάβετε δεδομένα και χρησιμοποιήστε τα μέσω μετατροπής json.

 

Το jQuery παρέχει συσκευασμένο AJAX το οποίο είναι πιο γρήγορο και κατάλληλο για χρήση σε έργα ανάπτυξης Το Native AJAX είναι πιο κατανοητό και κατανοητό.

Μορφή σύνταξης jQuery:

  1. $.ajax({
  2. type: "GET",
  3. url: 'js/exercise.json',
  4. data: {},
  5. headers:'',
  6. datatype:'',
  7. async:'',
  8. success: function(result) {
  9. console.log(result);
  10. data = result;
  11. },
  12. Error: function(e) {
  13. console.log(e.status);
  14. console.log(e.responseText);
  15. },
  16. });