AJAX yoki Ajax - bu asenkron JavaScript va XML. Bu server bilan ma'lumotlar almashish va veb -sahifaning bir qismini mijoz tomonida qayta yuklamasdan yangilash uchun ishlatiladi. Ma'lumot almashish va yangilashda mavjud veb -sahifaning ko'rinishi va xatti -harakatlariga hech qanday to'sqinlik qilinmaydi. Ajax, shuningdek, HTML, CSS, DOM va JavaScript -ga ega bo'lgan texnologiyalar guruhi hisoblanadi, ular foydalanuvchini veb -sahifadagi ma'lumotlar bilan ishlash, uslublash va o'zaro muloqot qilish imkonini beradi. Ushbu maqolada, sizga Notepad ++ yordamida bosqichma -bosqich Ajax -da oddiy dasturni qanday yozishni ko'rsatib beradi. HTML, DOM, JavaScript va mahalliy veb -server yoki masofaviy veb -server haqida ba'zi asosiy bilimlar talab qilinadi. WampServer ushbu maqolada test uchun ishlatiladi.
Qadamlar
2 -usul 1: kodlash
Qadam 1. Ajax dasturini yozish uchun rasm tayyorlang
Ajax dasturini ko'rsatadigan html va matnli fayllarni saqlaydigan rasmni o'sha papkada saqlang. Ushbu maqolada, "ProgramInAjax" katalogi "wamp" papkasida, siz WampServer o'rnatgan "www" katalogi ostida o'rnatiladi.
Qadam 2. Har qanday matn muharririni oching
Notepad ++ ushbu maqolada matn muharriri sifatida ishlatiladi.
Qadam 3. Matn muharririda yangi fayl yarating
Quyidagilarni kiriting:
Oh oh! Sariq gul qaerga ketdi?
Siz xohlagan narsani html tagiga yozishingiz mumkin.
Qadam 4. Faylni "ajax-data.txt" nomi bilan matnli hujjat sifatida saqlang
” Aslida, siz xohlagan faylga nom berishingiz mumkin, lekin shu satrda kodlash uchun bir xil fayl nomini kiritganingizga ishonch hosil qiling:
xmlhttp.open ("GET", "ajax-data.txt", to'g'ri);
Biroq, HTML taglari sarlavha uchun ishlatiladi, shunda u kattaroq va ko'rinmas ko'rinadi.
Qadam 5. Veb -sahifa uchun yangi fayl yarating
Bu fayl HTML brauzerida Ajax dasturini veb -brauzerda ko'rish uchun mo'ljallangan.
Qadam 6. Quyidagi kodni nusxa ko'chiring:
Mening birinchi Ajax dasturim Quyida Ajax kodini kiriting.Gulni yo'q qilish uchun quyidagi tugmani bosing
Qadam 7. Faylni saqlang
Menyu satrida saqlash tugmasini bosing. "Saqlash" qutisi ochiq. Hujjatingiz uchun nom kiriting. Ushbu maqolada fayl nomi "indeks" dir.
Qadam 8. Fayl kengaytmasini tanlash uchun ochiladigan o'qni bosing
"Turi sifatida saqlash" maydonida, kengaytmani tanlash uchun ochiladigan o'qni bosing.
Qadam 9. "Hyper Text Markup Language file" -ni tanlang
” Qavs ichida "html" borligiga ishonch hosil qiling. "HTML" ni tanlagandan so'ng saqlashni bosing.
10 -qadam. HTML -faylni veb -brauzerda tekshiring
Veb -sahifani veb -brauzerda oching. Yuqori menyu satrida "Ishga tushirish" -ga o'ting. Uni bosing va "Chrome -da ishga tushirish" -ni yoki tizimingizda o'rnatilgan brauzerni tanlang. Ushbu maqolada Google Chrome sinov uchun ishlatiladi. Notepad ++ da boshqa brauzerlar o'rnatilgan bo'lishi mumkin. Siz o'zingiz yoqtirgan brauzerni tanlashingiz mumkin. Boshqa variant, siz ekranning pastki qismidagi vazifalar panelidagi WampServer belgisini bosishingiz va "Localhost" ni tanlashingiz mumkin. U erda siz katalogni ko'rishingiz va indeks faylini bosishingiz kerak.
Qadam 11. Skriptni sinash uchun rasm ostidagi tugmani bosing
12 -qadam. Sizning oxirgi veb -sahifangiz
Sizning veb -sahifangiz boshida matnli faylga kiritilgan ma'lumotlar bilan yangilanishi kerak. Gul va sarlavhani "Oh oh!" Deb nomlangan yangi sarlavha bilan almashtirish kerak. Sariq gul qaerga ketdi?”
2 -ning 2 -usuli: Kodni tushuntirish
Qadam 1. Tana qismi
HTML -da "div" bo'limi va bitta tugma mavjud. Bu bo'lim serverdan qaytarilgan ma'lumotlarni ko'rsatish uchun ishlatiladi. Agar tugma bosilsa, "loadXMLDoc ()" funktsiyasini chaqiradi.
Mening birinchi Ajax dasturim Bu erda Ajax dasturini sinab ko'rish uchun rasm bor.Gulni yo'q qilish uchun quyidagi tugmani bosing
Bu erda tugma bosiladi
Qadam 2. Bosh qismi
HTML faylining bosh qismida "loadXMLDoc ()" funktsiyasini o'z ichiga olgan skript yorlig'i mavjud.
Mening birinchi Ajax dasturim Quyida Ajax kodini kiriting.
Qadam 3. Batafsil tushuntirish
Ajax -ning eng asosiysi bu XMLHttpRequest obyekti. Bu server bilan ma'lumotlar almashish uchun ishlatiladi va barcha zamonaviy brauzerlar ob'ektni qo'llab -quvvatlaydi.
- XMLHttpRequest () ob'ektini yaratish sintaksisi o'zgaruvchan = yangi XMLHttpRequest (); lekin ayni paytda ActiveX ob'ektidan foydalanadigan Internet Explorer eski versiyalarini (IE5 va IE6) yaratish sintaksisi o'zgaruvchan = yangi ActiveXObject ("Microsoft. XMLHTTP");.
- Barcha zamonaviy brauzerlarni boshqarish uchun brauzerlar XMLHttpRequest ob'ektini qo'llab -quvvatlayotganligini tekshirish kerak. Agar shunday bo'lsa, u XMLHttpRequest ob'ektini yaratadi. Agar yo'q bo'lsa, u ActiveX ob'ektini yaratadi.
- Keyin u serverga so'rov yuboradi. XMLHttpRequest ob'ektining "open ()" va "send ()" deb nomlangan usuli ishlatiladi. xmlhttp.open ("Oling", "ajax_info.txt", to'g'ri); xmlhttp.send ();.
Maslahatlar
- Natijani oldindan ko'rishning yana bir varianti, siz sevimli brauzeringizni ochib, veb -sahifani ko'rsatish uchun veb -manzil satriga "localhost/ProgramInAjax" yozishingiz mumkin. Agar siz HTML faylingizni "index.html" deb nomlasangiz, siz veb -sahifani ko'rishingiz kerak.
- Ish paytida html faylini tez -tez saqlang. Oyna foydalanuvchilari uchun Ctrl va S ni bir vaqtning o'zida bosish ko'proq vaqtni tejaydi.
- O'zingizning saqlangan HTML faylingizni rasm va ma'lumotlar matnli fayli joylashgan joyga qo'shganingizga ishonch hosil qiling.
- Faylni nomlaganingizda, bu nomlarni kodga qo'shsangiz, bu katta -kichik harflarga bog'liq. Masalan, "myImage" "MyImage" yoki "myimage" dan farq qiladi.