AJAX ali Ajax sta asinhrona JavaScript in XML. Uporablja se za izmenjavo podatkov s strežnikom in posodabljanje dela spletne strani brez ponovnega nalaganja celotne spletne strani na strani odjemalca. Prikaz in obnašanje obstoječe spletne strani med izmenjavo in posodabljanjem podatkov sploh ne vplivata. Ajax velja tudi za skupino tehnologij, ki imajo HTML, CSS, DOM in JavaScript, ki se uporabljajo za označevanje, oblikovanje in omogočanje uporabniku interakcije z informacijami na spletni strani. V tem članku vam bo pokazal, kako v korakih po korakih z Notepadom ++ napisati preprost program v Ajaxovih korakih. Potrebno je nekaj osnovnega znanja o HTML, DOM, JavaScript in lokalnem spletnem strežniku ali oddaljenem spletnem strežniku. WampServer je v tem članku uporabljen za preizkus.
Koraki
Metoda 1 od 2: Kodiranje
Korak 1. Pripravite sliko za pisanje programa Ajax
Shranite sliko v isto mapo, kamor boste shranili html in besedilne datoteke, ki prikazujejo program Ajax. V tem članku je imenik »ProgramInAjax« nastavljen v mapi »wamp« pod imenikom »www«, kjer ste namestili WampServer.
Korak 2. Odprite kateri koli urejevalnik besedil
Notepad ++ se v tem članku uporablja kot urejevalnik besedila.
Korak 3. V urejevalniku besedil ustvarite novo datoteko
Vnesite naslednje:
Oh oh! Kam je šel rumeni cvet?
V oznako html lahko vnesete, kar želite.
Korak 4. Shranite datoteko kot besedilni dokument z imenom »ajax-data.txt
” Pravzaprav lahko datoteko poimenujete, kot želite, vendar v kodiranje v tej vrstici vnesite isto ime datoteke:
xmlhttp.open ("GET", "ajax-data.txt", true);
Oznaka HTML pa se uporablja za glavo, tako da je videti večja in bolj nevidna.
Korak 5. Ustvarite novo datoteko za spletno stran
Ta datoteka je za datoteko HTML za ogled programa Ajax v spletnem brskalniku.
Korak 6. Kopirajte naslednjo kodo:
Moj prvi Ajaxov program Spodaj vnesite kodo Ajax.Kliknite spodnji gumb, da cvet izgine
Korak 7. Shranite datoteko
V menijski vrstici kliknite gumb za shranjevanje. Odpre se polje »Shrani kot«. Vnesite ime svojega dokumenta. V tem članku je ime datoteke »indeks«.
Korak 8. Kliknite spustno puščico, da izberete pripono datoteke
V polju »Shrani kot vrsto« kliknite spustno puščico, da izberete razširitev datoteke.
Korak 9. Izberite »Jezikovna datoteka za označevanje hiperbesedila
” Prepričajte se, da ima v oklepaju »html«. Ko izberete »html«, kliknite shrani.
Korak 10. Preizkusite datoteko HTML v spletnem brskalniku
Odprite spletno stran v spletnem brskalniku. V zgornji menijski vrstici pojdite na »Zaženi«. Kliknite ga in izberite »Zaženi v Chromu« ali kateri koli brskalnik, ki je nameščen v vašem sistemu. Za testiranje v tem članku se uporablja Google Chrome. Morda imate v Notepadu ++ nameščene nekatere druge brskalnike. Izberete lahko svoj najljubši brskalnik. Druga možnost je, da na opravilni vrstici na dnu zaslona kliknete ikono WampServer in izberete »Localhost«. Tam bi morali videti svoj imenik in klikniti datoteko indeksa.
Korak 11. Kliknite gumb pod sliko, da preizkusite skript
Korak 12. Vaša zadnja spletna stran
Vaša spletna stran mora biti osvežena z informacijami, ki ste jih na začetku vnesli v besedilno datoteko. Cvet in glavo je treba zamenjati z novo glavo z naslovom »Oh oh! Kam je šel rumeni cvet?"
Metoda 2 od 2: Razlaga kode
Korak 1. Odsek telesa
Telo HTML ima razdelek »div« in en gumb. Ta razdelek bo uporabljen za prikaz informacij, vrnjenih s strežnika. Gumb pokliče funkcijo z imenom »loadXMLDoc ()«, če jo kliknete.
Moj prvi Ajaxov program Tu gre slika za preizkus programa Ajax.Kliknite spodnji gumb, da cvet izgine
Tu gre gumb
Korak 2. Odsek glave
Glava datoteke HTML ima oznako skripta, ki vsebuje funkcijo »loadXMLDoc ()«.
Moj prvi Ajaxov program Spodaj vnesite kodo Ajax.
Korak 3. Več Pojasnilo
Najpomembnejša stvar Ajaxa je objekt XMLHttpRequest. Uporablja se za izmenjavo podatkov s strežnikom, vsi sodobni brskalniki pa objekt podpirajo.
- Sintaksa za ustvarjanje predmeta XMLHttpRequest () je spremenljiva = nov XMLHttpRequest (); hkrati pa je sintaksa za ustvarjanje starih različic Internet Explorerja (IE5 in IE6), ki uporablja objekt ActiveX, spremenljiva = nov ActiveXObject ("Microsoft. XMLHTTP");.
- Za upravljanje vseh sodobnih brskalnikov mora preveriti, ali brskalniki podpirajo objekt XMLHttpRequest. Če se to zgodi, ustvari objekt XMLHttpRequest. Če tega ne stori, bo zanj ustvaril objekt ActiveX.
- Nato bo strežniku poslal zahtevo. Uporabljena bo metoda predmeta XMLHttpRequest, imenovana »open ()« in »send ()«. xmlhttp.open ("GET", "ajax_info.txt", res); xmlhttp.send ();.
Nasveti
- Druga možnost za predogled rezultata je, da odprete svoj najljubši brskalnik in v naslovno vrstico vnesete »localhost/ProgramInAjax«, da prikažete spletno stran. Spletno stran bi morali videti, če datoteko HTML poimenujete »index.html«.
- Med delom pogosteje shranjujte datoteko html. Če uporabniki Windowa hkrati pritisnete Ctrl in S, boste prihranili več časa.
- Shranjeno datoteko HTML ne pozabite dodati na isto mesto, kjer sta datoteka s slikovno in podatkovno datoteko.
- Ko poimenujete datoteko, je pri dodajanju teh imen v kodo velika in mala črka. Na primer »myImage« se razlikuje od »MyImage« ali »myimage«.
