AJAX vai Ajax ir asinhronais JavaScript un XML. To izmanto datu apmaiņai ar serveri un tīmekļa lapas daļas atjaunināšanai, nepārlādējot visu tīmekļa lapu klienta pusē. Apmainoties un atjauninot datus, esošās tīmekļa lapas attēlojums un uzvedība netraucē. Ajax tiek uzskatīta arī par tehnoloģiju grupu, kurai ir HTML, CSS, DOM un JavaScript, kuras tiek izmantotas, lai iezīmētu, veidotu stilu un ļautu lietotājam mijiedarboties ar tīmekļa vietnē esošo informāciju. Šajā rakstā tas parādīs, kā rakstīt vienkāršu programmu Ajax soļos, izmantojot soļus, izmantojot Notepad ++. Nepieciešamas dažas pamatzināšanas par HTML, DOM, JavaScript un vietējo Web serveri vai attālo Web serveri. Šajā rakstā WampServer tiek izmantots pārbaudei.
Soļi
1. metode no 2: Kodēšana
1. solis. Sagatavojiet attēlu Ajax programmas rakstīšanai
Saglabājiet attēlu tajā pašā mapē, kur saglabāsit html un teksta failus, parādot Ajax programmu. Šajā rakstā katalogs “ProgramInAjax” ir iestatīts mapē “wamp” sadaļā “www”, kurā instalējāt WampServer.
2. solis. Atveriet jebkuru teksta redaktoru
Notepad ++ šajā rakstā tiek izmantots kā teksta redaktors.
3. Izveidojiet jaunu failu teksta redaktorā
Ierakstiet šādu tekstu:
Ak vai! Kur pazuda dzeltenais zieds?
Html tagā varat ierakstīt visu, ko vēlaties.
4. Saglabājiet failu kā teksta dokumentu ar nosaukumu “ajax-data.txt
” Faktiski jūs varat nosaukt failu tā, kā vēlaties, taču pārliecinieties, ka šajā rindā esošajam kodam ievadāt to pašu faila nosaukumu:
xmlhttp.open ("GET", "ajax-data.txt", true);
Tomēr galvenei tiek izmantots HTML tags, lai tas izskatītos lielāks un neredzamāks.
5. solis. Izveidojiet jaunu tīmekļa lapas failu
Šis fails ir paredzēts HTML failam, lai tīmekļa pārlūkprogrammā apskatītu Ajax programmu.
6. darbība. Kopējiet šādu kodu:
Mana pirmā Ajax programma Ievietojiet Ajax kodu zemāk.Noklikšķiniet uz tālāk esošās pogas, lai zieds pazustu
7. darbība. Saglabājiet failu
Izvēlnes joslā noklikšķiniet uz pogas Saglabāt. Ir atvērts lodziņš “Saglabāt kā”. Ievadiet sava dokumenta nosaukumu. Šajā rakstā faila nosaukums ir “indekss”.
8. solis. Noklikšķiniet uz nolaižamās bultiņas, lai izvēlētos faila paplašinājumu
Laukā “Saglabāt kā veidu” noklikšķiniet uz nolaižamās bultiņas, lai izvēlētos faila paplašinājumu.
9. solis. Atlasiet “Hiperteksta iezīmēšanas valodas fails
” Pārliecinieties, vai iekavās ir “html”. Pēc html atlasīšanas noklikšķiniet uz Saglabāt.
10. solis. Pārbaudiet HTML failu tīmekļa pārlūkprogrammā
Atveriet tīmekļa lapu tīmekļa pārlūkprogrammā. Augšējā izvēlnes joslā dodieties uz “Palaist”. Noklikšķiniet uz tā un atlasiet “Palaist pārlūkā Chrome” vai jebkuru pārlūkprogrammu, kas tiek instalēta jūsu sistēmā. Šajā rakstā veiktajai pārbaudei tiek izmantota pārlūkprogramma Google Chrome. Notepad ++ var būt instalētas dažas citas pārlūkprogrammas. Jūs varat izvēlēties savu iecienītāko pārlūkprogrammu. Vēl viena iespēja ir noklikšķināt uz WampServer ikonas uzdevumjoslā ekrāna apakšā un atlasīt “Localhost”. Jums vajadzētu redzēt savu direktoriju un noklikšķiniet uz indeksa faila.
11. solis. Noklikšķiniet uz pogas zem attēla, lai pārbaudītu skriptu
12. solis. Jūsu pēdējā tīmekļa lapa
Jūsu tīmekļa vietne ir jāatsvaidzina ar informāciju, kuru ievadījāt teksta failā sākumā. Zieds un galvene jāaizstāj ar jaunu galveni ar nosaukumu “Ak vai! Kur pazuda dzeltenais zieds?”
2. metode no 2: koda skaidrojums
Solis 1. Ķermeņa sadaļa
HTML pamattekstā ir sadaļa “div” un viena poga. Šī sadaļa tiks izmantota, lai parādītu no servera atgriezto informāciju. Poga izsauc funkciju ar nosaukumu “loadXMLDoc ()”, ja uz tās noklikšķina.
Mana pirmā Ajax programma Šeit tiek parādīts attēls, lai pārbaudītu Ajax programmu.Noklikšķiniet uz pogas zemāk, lai zieds pazustu
Šeit iet poga
Solis 2. Galvas sadaļa
HTML faila galvenajā sadaļā ir skripta tags, kurā ir funkcija “loadXMLDoc ()”.
Mana pirmā Ajax programma Ievietojiet Ajax kodu zemāk.
3. solis. Vairāk skaidrojumu
Ajax vissvarīgākā lieta ir XMLHttpRequest objekts. To izmanto datu apmaiņai ar serveri, un visas mūsdienu pārlūkprogrammas atbalsta objektu.
- Sintakse, lai izveidotu XMLHttpRequest () objektu, ir mainīga = new XMLHttpRequest (); bet tajā pašā laikā sintakse, lai izveidotu vecas Internet Explorer versijas (IE5 un IE6), kas izmanto ActiveX objektu, ir mainīga = new ActiveXObject ("Microsoft. XMLHTTP");.
- Lai apstrādātu visas mūsdienu pārlūkprogrammas, tai jāpārbauda, vai pārlūkprogrammas atbalsta XMLHttpRequest objektu. Ja tas notiek, tas izveido XMLHttpRequest objektu. Ja tas nenotiek, tas tam izveidos ActiveX objektu.
- Tad tas nosūtīs pieprasījumu serverim. Tiks izmantota XMLHttpRequest objekta metode ar nosaukumu “open ()” un “send ()”. xmlhttp.open ("GET", "ajax_info.txt", true); xmlhttp.send ();.
Padomi
- Vēl viena iespēja priekšskatīt rezultātu, varat atvērt savu iecienītāko pārlūkprogrammu un tīmekļa adreses joslā ierakstīt “localhost/ProgramInAjax”, lai parādītu tīmekļa lapu. Jums vajadzētu redzēt tīmekļa lapu, ja HTML failam piešķirat nosaukumu “index.html”.
- Darba laikā biežāk saglabājiet savu html failu. Nospiežot Ctrl un S vienlaikus Windows lietotājiem, tiks ietaupīts vairāk laika.
- Noteikti pievienojiet saglabāto HTML failu tajā pašā vietā, kur atrodas jūsu attēla un datu teksta fails.
- Piešķirot failam nosaukumu, šie nosaukumi tiek pievienoti kodam. Piemēram, “myImage” atšķiras no “MyImage” vai “myimage”.
