Άπειρη κύλιση: αποτελεσματική λύση ή μόδα; Βελτίωση της άπειρης κύλισης.

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

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

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

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

Μόνο μια σημείωση.

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

  • Τώρα ας μιλήσουμε για δύο καλούς λόγους για τους οποίους πρέπει να επιλέξετε το lazy loading:
  • Η αρχή της ασύγχρονης φόρτωσης είναι η φόρτωση περιεχομένου μόνο εάν ο επισκέπτης έχει κάνει κύλιση στην ιστοσελίδα στο τμήμα όπου εισέρχεται στο ορατό τμήμα του παραθύρου του προγράμματος περιήγησης.

    • Με απλά λόγια, οι φωτογραφίες δεν θα φορτωθούν εκτός εάν ο χρήστης κάνει κύλιση σε αυτό το σημείο της σελίδας. Και αυτό έχει θετική επίδραση στην εξοικονόμηση επισκεψιμότητας και επομένως πολλοί χρήστες που χρησιμοποιούν gadget και όσοι έχουν αδύναμο Διαδίκτυο θα εκτιμήσουν αυτό το χαρακτηριστικό του πόρου. Την επόμενη φορά σίγουρα θα θέλουν να το επισκεφθούν ξανά.

    Με βάση τα παραπάνω, μπορούμε να συμπεράνουμε ότι το lazy loading βελτιώνει σημαντικά την απόδοση του ιστότοπου.
  • Τύποι Lazy Loading
  • Κύλιση.
  • Το περιεχόμενο που δεν βρίσκεται στην ορατή περιοχή φορτώνεται μόνο αφού ο επισκέπτης διαβάσει το αρχικό περιεχόμενο που έχει ήδη φορτωθεί και κάνει κύλιση προς τα κάτω στη σελίδα. Μπορείτε να βρείτε αυτήν την επιλογή ασύγχρονης φόρτωσης στα κοινωνικά δίκτυα, όπου η ροή ειδήσεων δεν τελειώνει ποτέ, καθώς και σε ορισμένους διαδικτυακούς πόρους μέσων ενημέρωσης, ηλεκτρονικά καταστήματα και καταλόγους αγαθών και υπηρεσιών. Όταν χρησιμοποιείτε «ατελείωτη» κύλιση, είναι σημαντικό να διασφαλίσετε τη σωστή πλοήγηση στο κύριο μενού εγκαθιστώντας ένα σταθερό πάνελ ή ένα κουμπί «πάνω».
    • Κραυγή. Το περιεχόμενο θα φορτωθεί αφού ο χρήστης κάνει κλικ σε έναν ειδικό σύνδεσμο όπως "περισσότερες λεπτομέρειες". Περισσότερα παραδείγματα φόρτωσης κλικ-για-κλικ: η εμφάνιση των τροπικών παραθύρων και το άνοιγμα μιας εικόνας πλήρους μεγέθους αφού κάνετε κλικ στη μικρογραφία. Αυτή η μέθοδος εμφάνισης πληροφοριών είναι η πιο κοινή, αλλά σπάνια ενδιαφέρει τους χρήστες. Εάν το υλικό εξακολουθεί να ενδιαφέρει τον επισκέπτη ή είναι πολύ σημαντικό για τις μηχανές αναζήτησης και χρειάζεται μόνο να το κρύψετε για εξοικονόμηση χώρου, τότε είναι καλύτερο να εφαρμόσετε τη λειτουργία μέσω τυπικού JS και όχι AJAX. Με αυτόν τον τρόπο το περιεχόμενο θα φορτωθεί και θα εμφανιστεί μόνο αφού κάνετε κλικ.

    Λειτουργία φόντου.

    5 Lazy Loading Επιλογές για εικόνες

    Ας μιλήσουμε για τις πιο συνηθισμένες και έτοιμες λύσεις lazy φόρτωσης εικόνων.

    Σε μια απλοποιημένη έκδοση, αυτό το σενάριο αργής φόρτωσης αντικαθιστά το χαρακτηριστικό src με data-src στην ετικέτα img:

    Τα στοιχεία img που περιέχουν χαρακτηριστικά data-src είναι κρυμμένα στο . Μετά τη φόρτωση των εικόνων, εμφανίζονται ομαλά χρησιμοποιώντας μεταβάσεις:

    Img (αδιαφάνεια: 1; μετάβαση: αδιαφάνεια 0,3 δευτ.; ) img (αδιαφάνεια: 0; )

    Στη συνέχεια, η JavaScript μεταβιβάζει το χαρακτηριστικό src σε όλες τις ετικέτες img, οι οποίες τελικά λαμβάνουν την τιμή του χαρακτηριστικού data-src. Αφού φορτωθούν όλες οι εικόνες, το data-src αφαιρείται από το img :

    ForEach.call(document.querySelectorAll("img"), function(img) (img.setAttribute("src", img.getAttribute("data-src")); img.onload = function() (img.removeAttribute( "data-src");

    Ο David Walsh παρείχε επίσης μια εναλλακτική λύση σε περίπτωση αποτυχίας JavaScript, η οποία είναι αποτελεσματική και απλή στην εφαρμογή. Ωστόσο, η λειτουργικότητά του δεν επιτρέπει τη φόρτωση κατά την κύλιση της ιστοσελίδας. Αυτό σημαίνει ότι το πρόγραμμα περιήγησης φορτώνει όλες τις εικόνες, ανεξάρτητα από το αν ο επισκέπτης τις «προσέγγισε» ή όχι. Ναι, η εναλλακτική σάς επιτρέπει να εμφανίζετε τη σελίδα πιο γρήγορα, επειδή οι εικόνες φορτώνονται μετά το HTML, αλλά δεν θα υπάρξει εξοικονόμηση κίνησης.

    Η τεχνική περιλαμβάνει lazy loading, η οποία χρησιμοποιεί JS ως βελτίωση στο τυπικό CSS και HTML. Η προοδευτική βελτίωση διασφαλίζει ότι οι εικόνες εμφανίζονται στους χρήστες ακόμη και αν η JavaScript που είναι υπεύθυνη για την εμφάνισή τους είναι απενεργοποιημένη ή εμφανίζεται ένα σφάλμα που εμποδίζει τη λειτουργία του σεναρίου.

    Η προοδευτική βελτίωση έχει πολλά πλεονεκτήματα:

  • Η τεχνική είναι σχετική τόσο στην περίπτωση των απενεργοποιημένων όσο και των κατεστραμμένων JS. Αυτό είναι σημαντικό επειδή τα σενάρια συχνά υπόκεινται σε σφάλματα.
  • Παρέχει στους χρήστες εύκολη πρόσβαση σε υλικά πόρων.
  • Δεν χρειάζεται να χρησιμοποιήσετε πρόσθετα ή πλαίσια για την εφαρμογή της μεθόδου.
  • Η Lazy loading λειτουργεί με κύλιση - οι φωτογραφίες δεν θα φορτωθούν έως ότου ο επισκέπτης πραγματοποιήσει κύλιση της σελίδας στο κατάλληλο μέρος.

    • Μπορείτε να μάθετε αναλυτικές πληροφορίες σχετικά με τη λύση Osborne.

    Νο 3. Πρόσθετο bLazy.js χρησιμοποιώντας απλό JS

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

  • Τεμπέλης φόρτωση φόντου και προστιθέμενων εικόνων.
  • Υποστήριξη για προγράμματα περιήγησης παλαιού τύπου, συμπεριλαμβανομένων των εκδόσεων IE 7 και 8.
  • Φόρτωση εικόνων σε κοντέινερ με δυνατότητα κύλισης.
  • Χρήση ενός CDN για τη φιλοξενία μιας προσθήκης εκτός διακομιστή.
  • Φόρτωση όλων των στοιχείων που περιέχουν το χαρακτηριστικό src: σενάρια, iframes, κ.λπ.
  • Ασύγχρονη φόρτωση φωτογραφιών με βάση την ανάλυση και το μέγεθος της οθόνης.

    • Τυπική υλοποίηση. Σήμανση:

    Η ετικέτα img πρέπει να αλλάξει:

  • Προσθήκη class.b-lazy.
  • Εφαρμόστε ένα σύμβολο κράτησης θέσης ως τιμή src. Τα διαφανή inline gif με τη βάση κώδικα θα βοηθήσουν στην αποθήκευση του αριθμού των αιτημάτων στον διακομιστή. Λάβετε όμως υπόψη ότι άλλες σελίδες που χρησιμοποιούν τις ίδιες εικόνες δεν θα αποθηκευτούν προσωρινά.
  • Το Data-src δείχνει την εικόνα που πρέπει να φορτωθεί ασύγχρονα.

    • JavaScript: καθορίστε μια τυπική κλήση bLazy και διαμορφώστε το αντικείμενο χρησιμοποιώντας τον χάρτη επιλογών:

    Var bLazy = new Blazy(( //options ));

    Νο 4. Πρόσθετο Lazy Load XT jQuery

    Ένα εξαιρετικό πρόσθετο για να γράψετε εύκολα το δικό σας σενάριο τεμπέλης φόρτωσης. Λάβετε υπόψη ότι υπάρχει μια πλήρης έκδοση του πρόσθετου jQuery, όπου μπορείτε να φορτώσετε βίντεο, iframes και άλλες ετικέτες που περιέχουν το χαρακτηριστικό src μέσω ασύγχρονης φόρτωσης και υπάρχει μια απλοποιημένη έκδοση που είναι αφιερωμένη αποκλειστικά στην απλή τεμπέλικη φόρτωση.

    Για να χρησιμοποιήσετε την προσθήκη στον ιστότοπο, πρέπει να προσθέσετε τη βιβλιοθήκη jQuery πριν από την ετικέτα κλεισίματος, προσδιορίζοντας jquery.lazyloadxt.js (απλοποιημένη έκδοση) ή jquery.lazyloadxt.extra.js (εκτεταμένη):

    Υπάρχει επίσης μια εναλλακτική επιλογή που σας επιτρέπει να μην χρησιμοποιείτε ολόκληρο το πρόσθετο - ένα ελαφρύ σενάριο jqlight.lazyloadxt.min.js:

    Στις εικόνες, αντικαταστήστε το src με το χαρακτηριστικό data-src:

    Το πρόσθετο μπορεί να ενεργοποιηθεί αυτόματα ή μπορείτε να το κάνετε μόνοι σας. Για να το κάνετε αυτό, απλώς εισάγετε:

    $(στοιχεία).lazyLoadXT();

    Το Lazy Load XT jQuetry προσθέτει μεγάλο αριθμό πρόσθετων. Για παράδειγμα:

  • Με την προσθήκη του jquery.lazyloadxt.spinner.css, είναι δυνατό να εμφανιστεί ένα κινούμενο spinner κατά τη διαδικασία φόρτωσης της εικόνας.
  • Συνδέοντας το animate.min.css για τον ιστότοπο και προσδιορίζοντας $.lazyLoadXT.onload.addClass = 'animated bounceOutLeft' στο αρχείο JS.

    • Μπορείτε να προσθέσετε διάφορα εφέ από το Animate.css για να φορτώσετε εικόνες.

  • Πλεονεκτήματα της τεχνικής:
  • Λειτουργεί με μεγάλο αριθμό προγραμμάτων περιήγησης.
  • Υποστηρίζει CDN, επομένως τα σενάρια δεν χρειάζεται να φορτωθούν στον διακομιστή.
  • Παρέχει τη δυνατότητα ασύγχρονης φόρτωσης πολλών τύπων μέσων.
  • Τα πρόσθετα σάς επιτρέπουν να δημιουργείτε όμορφες μεταβάσεις, να φορτώνετε νωχελικά εικόνες φόντου και πολλά άλλα.
  • Υπάρχει πληθώρα επιλογών για τη χρήση τεμπέλης φόρτωσης - σε μια σελίδα, σε διατάξεις με οριζόντια ή κατακόρυφη κύλιση, σε κοντέινερ κ.λπ.
  • Εάν δεν θέλετε να χρησιμοποιήσετε ολόκληρο το πρόσθετο, μπορείτε να συνδέσετε ένα ελαφρύ σενάριο.

    • Μπορείτε να δείτε όλα τα πρόσθετα και τις επιλογές χρησιμοποιώντας αυτόν τον σύνδεσμο.

    Νο 5. Θολή εικόνα από τον Craig Buckler

    Πιθανότατα έχετε παρατηρήσει σε ορισμένους ιστότοπους πώς η κύρια εικόνα ενός άρθρου είναι αρχικά θολή, αλλά στη συνέχεια φορτώνεται μια καθαρή εικόνα υψηλής ποιότητας. Υπάρχουν πολλές επιλογές για τη μεταφόρτωση φωτογραφιών χρησιμοποιώντας τη μέθοδο του εφέ θολώματος. Ένας από τους καλύτερους είναι ο Craig Buckler.

    Τα πλεονεκτήματα της τεχνικής είναι:

  • Υψηλή απόδοση: λίγο περισσότερο από 1 byte κώδικα JS και 463 byte CSS.
  • Ανεξαρτησία από πλαίσια και βιβλιοθήκες.
  • Υποστήριξη οθόνης Retina.
  • Εφαρμογή προοδευτικής βελτίωσης σε κατεστραμμένα JavaScript και παλιά προγράμματα περιήγησης.

    • Μπορείτε να κάνετε λήψη του κώδικα από το αποθετήριο ιστότοπου GitHub.

    Πρώτα πρέπει να συμπεριλάβετε τη βιβλιοθήκη jQuery:

    Η ουσία της μεθόδου είναι να φορτώσει το απαιτούμενο στοιχείο div από το αριστερό αρχείο στη σελίδα προορισμού χρησιμοποιώντας AJAX.

    Χαρτοφυλάκιο Εμφάνιση περισσότερων...

    Όλα είναι αρκετά απλά και ξεκάθαρα. Πρέπει όμως να προσέξεις το div με το id=”smartPortfolio”, γιατί είναι στο πιο σημαντικό σενάριο υπεύθυνος για τη φόρτωση περιεχομένου από έγγραφα τρίτων. Το «κοντέινερ» του χαρτοφυλακίου είναι το SmartPortfolio. MoreButton – ένα κουμπί στο οποίο, όταν κάνετε κλικ, φορτώνει ένα άλλο τμήμα χαρτοφυλακίου. LoadingDiv – μέρος της σελίδας όπου το κείμενο θα εμφανίζεται εάν το χαρτοφυλάκιο είναι πλήρως ανοιχτό ή παρουσιαστεί οποιοδήποτε σφάλμα.

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

    Εδώ είναι το ίδιο το σενάριο, για να το συνδέσετε πρέπει να εισαγάγετε τον κώδικα πριν από την ετικέτα κλεισίματος σώματος:

    Var lazyload = τεμπέλης || () (function($, lazyload) ( "use strict"; var page = 2, buttonId = "#moreButton", loadingId = "#loadingDiv", container = "#smartPortfolio"; lazyload.load = function() ( var url = "./pages/" + page + ".html"; $(buttonId).απόκρυψη (loadingId). !response ||. answer.trim() == "ΚΑΜΙΑ") ( $(buttonId).fadeOut(); απάντηση) ($(loadingId).text("Συγγνώμη, υπήρξε κάποιο σφάλμα με το αίτημα. Ανανεώστε τη σελίδα."); ) ) $(buttonId). ).appendTo($(container));

    Στη δομή του πόρου Ιστού, οι σελίδες από τις οποίες θα ληφθούν τα δεδομένα για να φορτωθούν όταν πατηθούν βρίσκονται στο φάκελο σελίδων. Περιέχει 3 αρχεία, το τελευταίο είναι κενό. Αυτό προβλέπεται από τη λογική του σεναρίου. Η διαδρομή σε αυτό μοιάζει με αυτό:

    Var url = "./pages/" + page + ".html";

    Αλλά όταν χρησιμοποιείτε μια διαφορετική διαδρομή, είναι σημαντικό να την αντικαταστήσετε στο ίδιο το σενάριο. Το ίδιο πρέπει να κάνετε εάν χρησιμοποιήσατε άλλα αναγνωριστικά:

    ButtonId = "#moreButton", loadingId = "#loadingDiv", container = "#smartPortfolio";

    Στη συνέχεια, όπως αναφέρθηκε προηγουμένως, πριν από την ετικέτα body (closing), υποδεικνύουμε το σενάριο:

    Σύναψη

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

    ένα! Η διάσπαση του περιεχομένου σε σελίδες με αριθμούς είναι ένα κλασικό σχήμα σελιδοποίησης, διαισθητικό και οικείο στους χρήστες. Ωστόσο, πρόσφατα όλο και περισσότεροι ιστότοποι αρχίζουν να «θέτουν στην πράξη» αυτόν τον τύπο πλοήγησης στη σελίδα, όπως το Infinite Scroll. Ακόμη και γίγαντες όπως η Google, το Facebook και η VKontakte δεν αποτελούσαν εξαίρεση. Φυσικά, αυτός ο τύπος σελιδοποίησης έχει τα πλεονεκτήματα και τα μειονεκτήματά του, αλλά αυτό είναι μια άλλη συζήτηση. Σε αυτό το σεμινάριο θα δούμε πώς να εφαρμόσουμε μια τέτοια πλοήγηση.

    Πώς λειτουργεί;!

    Ναι, όλα είναι πολύ απλά, αν ο χρήστης έχει ήδη κάνει κύλιση σε έναν συγκεκριμένο αριθμό αναρτήσεων και βρίσκεται στο κάτω μέρος της σελίδας, τότε περισσότερα μηνύματα φορτώνονται με μια μικρή καθυστέρηση. Για να γίνει αυτό, χρησιμοποιώντας το $.post δημιουργούμε ένα αίτημα POST στη σελίδα για λήψη δεδομένων από τη βάση δεδομένων (αρχείο .php), η δομή HTML των εγγραφών δημιουργείται στο ίδιο αρχείο. Μετά από αυτό, δομώντας τη σήμανση HTML, τα δεδομένα επιστρέφονται στο σενάριο και τοποθετούνται στη σελίδα.

    Η διαδικασία προσδιορισμού της θέσης του χρήστη στη σελίδα:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25

    // Εάν η κύλιση είναι ενεργοποιημένη
    αν ($settings.scroll == true ) (
    // .. και ο χρήστης κάνει κύλιση στη σελίδα
    $(window).scroll(function() (

    // Ελέγξτε αν ο χρήστης βρίσκεται στο κάτω μέρος της σελίδας
    if ($(window).scrollTop() + $(window).height() > $this.height() && !busy) (

    // Διαδικασία σε εξέλιξη
    απασχολημένος
    $this.).html) ;

    // Εκτελέστε μια συνάρτηση για ανάκτηση δεδομένων με καθορισμένη καθυστέρηση
    // Αυτό είναι χρήσιμο εάν έχετε περιεχόμενο στο υποσέλιδο
    setTimeout(συνάρτηση () (

    GetData() ;

    ) , $settings.delay ) ;

    }
    } ) ;
    }

    Πιθανότατα παρατηρήσατε τη χρήση μεταβλητών, παραμέτρων πρόσθετων, για να το πούμε έτσι, περισσότερα για αυτές λίγο αργότερα. Η συνάρτηση αιτήματος AJAX για ένα αρχείο PHP getData() μοιάζει με αυτό:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33

    // Συνάρτηση αιτήματος AJAX
    συνάρτηση getData() (

    // Δημιουργία αιτήματος POST στο ajax.php
    $.post("ajax.php" , (

    Δράση: "κύλιση σελιδοποίησης"
    αριθμός: $settings.nop,
    μετατόπιση: μετατόπιση,

    ) , συνάρτηση (δεδομένα) ) .html ($initmessage) ;

    // Εάν τα δεδομένα που επιστρέφονται είναι άδεια, τότε αναφέρετέ τα
    if (data).html($settings.error);
    }
    αλλού(
    // Η μετατόπιση αυξάνεται
    offset = offset+ $settings.nop ;

    // Προσθέστε τα ληφθέντα δεδομένα στο περιεχόμενο DIV
    $this.find(".content").append(data);

    // Η διαδικασία ολοκληρώθηκε
    απασχολημένος = ψευδής ;
    }

    } ) ;

    Αρχείο AJAX.php

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

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22



    Συνιστούμε να διαβάσετε