Si të programoni në Ajax (me fotografi)

Përmbajtje:

Si të programoni në Ajax (me fotografi)
Si të programoni në Ajax (me fotografi)

Video: Si të programoni në Ajax (me fotografi)

Video: Si të programoni në Ajax (me fotografi)
Video: СТРАШНЫЕ ПРИЗРАКИ ПОКАЗАЛИ СВОЮ СИЛУ НОЧЬЮ В ТАИНСТВЕННОЙ УСАДЬБЕ / WHAT ARE GHOSTS CAPABLE OF? 2024, Prill
Anonim

AJAX ose Ajax është JavaScript Asinkron dhe XML. Përdoret për shkëmbimin e të dhënave me një server dhe azhurnimin e një pjese të një faqe në internet pa ngarkuar të gjithë faqen në anën e klientit. Shfaqja dhe sjellja e faqes ekzistuese të internetit nuk ndërhyn fare gjatë shkëmbimit dhe azhurnimit të të dhënave. Ajax konsiderohet gjithashtu një grup teknologjish të cilat kanë HTML, CSS, DOM dhe JavaScript të cilat përdoren për të shënuar, stiluar dhe lejuar përdoruesit të ndërveprojë me informacionin në uebfaqe. Në këtë artikull, do t'ju tregojë se si të shkruani një program të thjeshtë në hapa Ajax me hapa duke përdorur Notepad ++. Kërkohen disa njohuri themelore për HTML, DOM, JavaScript dhe një server lokal në internet ose një server të largët në internet. WampServer përdoret në këtë artikull për një provë.

Hapa

Metoda 1 nga 2: Kodimi

3929304 1
3929304 1

Hapi 1. Përgatitni një fotografi për të shkruar një program Ajax

Ruani foton në të njëjtën dosje ku do të ruani skedarët tuaj html dhe tekst që shfaqin programin Ajax. Në këtë artikull, drejtoria "ProgramInAjax" është ngritur brenda dosjes "wamp" nën drejtorinë "www" ku keni instaluar WampServer.

3929304 2
3929304 2

Hapi 2. Hapni çdo redaktues teksti

Notepad ++ përdoret si redaktues teksti në këtë artikull.

3929304 3
3929304 3

Hapi 3. Krijoni një skedar të ri në redaktuesin e tekstit

Shkruani sa vijon:


Oh oh! Ku shkoi lulja e verdhë?

Ju mund të shkruani çfarë të doni brenda etiketës html.

3929304 4
3929304 4

Hapi 4. Ruani skedarin si një dokument teksti me emrin "ajax-data.txt

” Në fakt, ju mund ta emërtoni skedarin çfarë të doni, por sigurohuni që të futni të njëjtin emër skedari në kodim në këtë rresht:

xmlhttp.open ("GET", "ajax-data.txt", e vërtetë);

Sidoqoftë, etiketat HTML përdoren për kokën në mënyrë që të duket më e madhe dhe më e padukshme.

3929304 5
3929304 5

Hapi 5. Krijoni një skedar të ri për një faqe në internet

Ky skedar është për një skedar HTML për të parë programin Ajax në një shfletues uebi.

3929304 6
3929304 6

Hapi 6. Kopjoni kodin e mëposhtëm:

  Programi im i parë Ajax nga Unë Vendosni kodin Ajax më poshtë.  


Klikoni butonin më poshtë për ta zhdukur lulen

3929304 7
3929304 7

Hapi 7. Ruani skedarin

Klikoni butonin ruaj në shiritin e menusë. Një kuti "Ruaj si" është e hapur. Vendosni një emër për dokumentin tuaj. Në këtë artikull, emri i skedarit është "indeks".

3929304 8
3929304 8

Hapi 8. Klikoni shigjetën zbritëse për të zgjedhur shtesën e skedarit

Në fushën "Ruaj si lloj", klikoni shigjetën zbritëse për të zgjedhur shtesën e skedarit.

3929304 9
3929304 9

Hapi 9. Zgjidhni “Hyper Text Markup Language file

” Sigurohuni që të ketë "html" brenda kllapës. Klikoni në ruajtje pasi të zgjidhni "html".

3929304 10
3929304 10

Hapi 10. Testoni skedarin HTML në një shfletues uebi

Hapni faqen në një shfletues uebi. Shkoni te "Run" në shiritin e menusë së sipërme. Klikoni mbi të dhe zgjidhni "Launch in Chrome" ose ndonjë shfletues që është duke u instaluar në sistemin tuaj. Google Chrome përdoret për testimin në këtë artikull. Mund të keni disa shfletues të tjerë të instaluar brenda Notepad ++. Ju mund të zgjidhni shfletuesin tuaj të preferuar. Një opsion tjetër, mund të klikoni në ikonën WampServer në shiritat e detyrave në fund të ekranit dhe zgjidhni "Localhost". Ju duhet të shihni drejtorinë tuaj atje dhe të klikoni skedarin e indeksit.

Hapi 11. Klikoni butonin poshtë figurës për të testuar skriptin

3929304 12
3929304 12

Hapi 12. Uebfaqja juaj përfundimtare

Faqja juaj e internetit duhet të rifreskohet me informacionin që keni futur në skedarin e tekstit në fillim. Lulja dhe titulli duhet të zëvendësohen me titullin e ri të quajtur "Oh oh! Ku shkoi lulja e verdhë?"

Metoda 2 nga 2: Shpjegimi i Kodit

3929304 13
3929304 13

Hapi 1. Seksioni i trupit

Trupi i HTML ka seksionin "div" dhe një buton. Ky seksion do të përdoret për të shfaqur informacionin e kthyer nga serveri. Butoni thërret një funksion të quajtur "loadXMLDoc ()", nëse klikohet.

   Programi im i parë Ajax nga Unë   Një imazh shkon këtu për të testuar programin Ajax.

Klikoni butonin më poshtë për ta zhdukur lulen

Një buton shkon këtu

3929304 14
3929304 14

Hapi 2. Seksioni i kokës

Seksioni i kokës së skedarit HTML ka një etiketë skripti e cila përmban funksionin "loadXMLDoc ()".

 Programi im i parë Ajax nga Unë Vendosni kodin Ajax më poshtë. 

Hapi 3. Më shumë Shpjegim

Gjëja më e rëndësishme e Ajax është objekti XMLHttpRequest. Përdoret për të shkëmbyer të dhëna me serverin dhe të gjithë shfletuesit modernë e mbështesin objektin.

  • Sintaksa për të krijuar një objekt XMLHttpRequest () është e ndryshueshme = e re XMLHttpRequest (); por në të njëjtën kohë sintaksa për të krijuar versione të vjetra të Internet Explorer (IE5 dhe IE6) që përdor një objekt ActiveX është e ndryshueshme = e re ActiveXObject ("Microsoft. XMLHTTP");.
  • Për të trajtuar të gjithë shfletuesit modernë, duhet të kontrolloni nëse shfletuesit mbështesin objektin XMLHttpRequest. Nëse po, krijon një objekt XMLHttpRequest. Nëse dikush nuk e bën, do të krijojë një objekt ActiveX për të.
  • Pastaj do t'i dërgojë një kërkesë serverit. Do të përdoret metoda e objektit XMLHttpRequest të quajtur "open ()" dhe "send ()". xmlhttp.open ("GET", "ajax_info.txt", e vërtetë); xmlhttp.send ();.

Këshilla

  • Një opsion tjetër për të parë paraprakisht rezultatin, mund të hapni shfletuesin tuaj të preferuar dhe të shkruani "localhost/ProgramInAjax" në shiritin e adresave të uebit për të shfaqur faqen e internetit. Ju duhet të jeni në gjendje të shihni faqen në internet nëse e emërtoni skedarin tuaj HTML në "index.html".
  • Ruani skedarin tuaj html më shpesh gjatë punës tuaj. Shtypja e Ctrl dhe S në të njëjtën kohë për përdoruesit e Window do të kursejë më shumë kohë.
  • Sigurohuni që të shtoni skedarin tuaj të ruajtur HTML në të njëjtin vend ku janë skedari i tekstit të imazhit dhe të dhënave tuaja.
  • Kur emërtoni një skedar, është i ndjeshëm ndaj shkronjave kur i shtoni ato emra në kod. Për shembull, "myImage" është e ndryshme nga "MyImage" ose "myimage".

Recommended: