Veb-sahifalardagi xatolar va ularni qanday topish va tuzatish. Sintaksis va boshqa kod xatolarini aniqlash uchun konsol yordamida Internet Explorer-da skript xatosini qanday tuzatish mumkin

Ko'pincha foydalanuvchilar Internet Explorer (IE) brauzerida skript xato xabari paydo bo'ladigan vaziyatni kuzatishi mumkin. Agar vaziyat izolyatsiya qilingan bo'lsa, unda siz tashvishlanmasligingiz kerak, lekin bunday xatolar muntazam bo'lib qolsa, unda bu muammoning tabiati haqida o'ylashingiz kerak.

Internet Explorer-dagi skript xatosi odatda brauzer tomonidan HTML sahifa kodini noto'g'ri qayta ishlash, vaqtinchalik Internet-fayllarning mavjudligi, hisob sozlamalari va boshqa ko'plab sabablar tufayli yuzaga keladi, ular ushbu materialda muhokama qilinadi. Ushbu muammoni hal qilish usullari ham ko'rib chiqiladi.

Skript xatolariga olib keladigan Internet Explorer bilan bog'liq muammolarni tashxislashning umumiy usullariga o'tishdan oldin, xatolik nafaqat ma'lum bir saytda, balki bir vaqtning o'zida bir nechta veb-sahifalarda paydo bo'lishiga ishonch hosil qilishingiz kerak. Bundan tashqari, boshqa hisob ostida, boshqa brauzerda va boshqa kompyuterda ushbu muammoga duch kelgan veb-sahifani tekshirishingiz kerak. Bu xato sababini qidirishni qisqartiradi va xabarlar shaxsiy kompyuterda ma'lum fayllar yoki sozlamalar mavjudligi natijasida paydo bo'lishi haqidagi farazni istisno qiladi yoki tasdiqlaydi.

Internet Explorer faol skriptlarini, ActiveX va Java-ni bloklash

Faol skriptlar, ActiveX boshqaruvlari va Java ma'lumotni yaratish va saytda ko'rsatish usuliga ta'sir qiladi va agar ular foydalanuvchi shaxsiy kompyuterida bloklangan bo'lsa, avval tasvirlangan muammoning haqiqiy sababi bo'lishi mumkin. Shu sababli skript xatolari yuzaga kelishiga ishonch hosil qilish uchun brauzerning xavfsizlik sozlamalarini tiklash kifoya. Buning uchun quyidagi ko'rsatmalarga amal qiling.

• Internet Explorer 11-ni oching
• Xizmat

• Oynada yorliqga o'ting Xavfsizlik
• Keyingi tugmani bosing Standart va keyin tugma OK

Internet Explorer vaqtinchalik fayllar

Har safar veb-sahifani ochganingizda, Internet Explorer ushbu veb-sahifaning mahalliy nusxasini shaxsiy kompyuteringizda vaqtinchalik fayllarda saqlaydi. Bunday fayllar juda ko'p bo'lsa va ularni o'z ichiga olgan papka hajmi bir necha gigabaytga yetganda, veb-sahifani ko'rsatish bilan bog'liq muammolar paydo bo'lishi mumkin, ya'ni skript xatosi haqida xabar paydo bo'ladi. Vaqtinchalik fayllar jildini muntazam tozalash bu muammoni hal qilishga yordam beradi.
Vaqtinchalik Internet fayllarini o'chirish uchun quyidagi amallarni bajaring.

• Internet Explorer 11-ni oching
• Brauzerning yuqori o'ng burchagidagi belgini bosing Xizmat vites shaklida (yoki Alt + X tugmalar birikmasi). Keyin ochilgan menyuda tanlang
• Oynada yorliqga o'ting General
• Bo'limda Brauzer tarixi tugmasini bosing Oʻchirish…

• Oynada Koʻrish tarixini oʻchirish elementlar yonidagi katakchalarni belgilang Internet va veb-saytlarning vaqtinchalik fayllari, Cookie fayllari va veb-sayt ma'lumotlari, Jurnal
• Tugmasini bosing Oʻchirish

Antivirus dasturining ishlashi

Antivirus dasturi faol skriptlarni, ActiveX va Java boshqaruv elementlarini sahifadagi yoki vaqtinchalik brauzer fayllarini saqlash uchun papkalarni bloklaganda skript xatolari mumkin. Bunday holda, siz o'rnatilgan antivirus mahsuloti uchun hujjatlarga murojaat qilishingiz va vaqtinchalik Internet fayllarini saqlash, shuningdek, interaktiv ob'ektlarni blokirovka qilish uchun papkalarni skanerlashni o'chirib qo'yishingiz kerak.

HTML sahifa kodini noto'g'ri qayta ishlash

Bu, qoida tariqasida, ma'lum bir saytda paydo bo'ladi va sahifa kodi Internet Explorer bilan ishlashga to'liq moslashtirilmaganligini ko'rsatadi. Bunday holda, brauzerda skriptni tuzatishni o'chirib qo'yish yaxshidir. Buning uchun quyidagi amallarni bajaring.

• Internet Explorer 11-ni oching
• Brauzerning yuqori o'ng burchagidagi belgini bosing Xizmat vites shaklida (yoki Alt + X tugmalar birikmasi). Keyin ochilgan menyuda tanlang
• Oynada yorliqga o'ting Qo'shimcha
• Keyin, katakchadan belgini olib tashlang Har bir skript xatosi uchun bildirishnomani ko'rsatish va tugmani bosing OK.

Bu Internet Explorer-da skript xatolariga olib keladigan eng keng tarqalgan sabablar ro'yxati, shuning uchun siz bunday xabarlardan charchagan bo'lsangiz, ozgina e'tibor bering va muammoni bir marta va butunlay hal qiling.

Ba'zan brauzer foydalanuvchini skript xatosi haqida xabar berishi mumkin. Bu standart Internet Explorer uchun ham amal qiladi. Aytgancha, bunday nosozlik boshqa brauzerlarga qaraganda tez-tez sodir bo'ladi. Bu muammoga nima sabab bo'lishi mumkin va uni qanday hal qilish mumkin?

Skript xatosi odatda brauzer HTML sahifa kodlarini to'g'ri qayta ishlamasa sodir bo'ladi. Bundan tashqari, yuklab olishda xatolik haddan tashqari ko'p vaqtinchalik fayllarga olib kelishi mumkin (ayniqsa, brauzer uzoq vaqt davomida ulardan tozalanmagan bo'lsa). Bundan tashqari, ba'zi hisob sozlamalari resursni to'g'ri ishga tushirishga xalaqit berishi mumkin. Bugun biz ushbu sabablarning barchasini hisobga olgan holda Internet Explorer-da skript xatosini qanday olib tashlashni ko'rib chiqamiz.

Birinchi qadamlar

Agar bu birinchi marta sodir bo'lsa, bu alohida holat bo'lishi mumkin. Shuning uchun, tashvishlanadigan hech narsa yo'q. Sahifani qayta yuklashga harakat qiling. Agar ushbu skriptni ishga tushirishni to'xtatishni xohlayotganingizni so'ragan bildirishnoma yana paydo bo'lsa, "Yo'q" tugmasini bosing.

Biz bu alohida holat emasligini aniqladik. Keyin nima qilish kerak? Barcha sahifalarni yoki bitta sahifani ochishda xatolik yuz beradimi, qarang. Agar bittasida bo'lsa, xuddi shu saytdagi boshqa hisobga o'ting, sahifani boshqa brauzer va kompyuterda oching.

Siz boshqa brauzerdan foydalanishingiz mumkin. Bugungi kunda ular juda ko'p, ammo ular standart asbobdan hech qanday kam bo'lmasa-da, ular hatto ko'p narsalarda ham oshib ketishadi. Agar sizda IE-da saqlangan barcha xatcho'plar bo'lsa, ma'lumotlarni eksport qilish funksiyasidan foydalanishingiz mumkin.

Faol ActiveX va Java skriptlarini bloklash

Boshqa dasturga o'tmaslikka qaror qildingizmi? Bunday holda, biz muammoni yanada hal qilamiz.

Active X va Java o'chirilgan yoki bloklangan bo'lishi mumkin. Bu skript xatosining keng tarqalgan sabablaridan biridir. Bu holatda nima qilish kerak? Brauzeringizning xavfsizlik sozlamalarini tiklashingiz kerak.

Dasturni ishga tushiring. Tishli belgisini bosing. U yulduzcha yonida bo'ladi. Ko'rsatilgan variantlar ro'yxatida "Internet Options" bo'limini tanlang. Bu oxirgi nuqta bo'ladi.

Ikkinchi "Xavfsizlik" yorlig'ini oching. "Standart" tugmasini bosing. OK tugmasini bosing.

Brauzerda vaqtinchalik fayllar

Internet Explorer sahifa versiyalarini ishga tushirilganda saqlaydi. Barcha nusxalar vaqtinchalik fayllar bilan papkada saqlanadi. Ushbu jildni vaqti-vaqti bilan tozalash kerak. Agar jild, masalan, bir necha gigabayt hajmga yetsa, brauzer muzlaydi va ayniqsa, skript xatosi chiqaradi. Bunday holda, ko'rsatilgan saqlashning barcha tarkibini olib tashlashingiz kerak.

Quyidagi usul keshdagi keraksiz narsalardan, ko'rib chiqish tarixidan, cookie-fayllardan, veb-shakl ma'lumotlaridan va parollardan xalos bo'lishga yordam beradi. Siz, albatta, qaysi turdagi fayllarni o'chirish va qaysi birini saqlashni tanlash huquqiga egasiz.

• Shunga qaramay, bizga allaqachon tanish bo'lgan uskunani bosing. "Internet imkoniyatlari" ni tanlang.
• "Umumiy" bo'limiga o'ting.
• "Brauzer tarixi" blokida "O'chirish" tugmasini ishonch bilan bosing.
• O'chirmoqchi bo'lgan vaqtinchalik fayllar va boshqa turdagi fayllar uchun katakchalarni belgilang va keyin o'chirishni tasdiqlang.

Antivirusni blokirovka qilish

Skriptlar ishlamasligi mumkin, chunki sizning antivirus dasturingiz ularni bloklaydi yoki vaqtinchalik fayllar bilan papkalarni skanerlaydi. Nima qilishimiz kerak? Antivirus oynasini oching va interaktiv elementlarni bloklashni o'chiring. Barcha antiviruslar uchun yagona o'chirish yo'riqnomasi mavjud emas. Jarayon antivirus turiga qarab farq qiladi.

HTML sahifa kodini noto'g'ri qayta ishlash

Bu holat, odatda, faqat bitta sayt muzlaganda sodir bo'ladi. Bu sahifa kodi Internet Explorer uchun mos emasligini anglatadi. Sahifani yuklash uchun skriptni tuzatish o'chirilgan bo'lishi kerak.

• "Internet Options" oynasiga qayting.
• Bu safar to'rtinchi blokga o'ting "Qo'shimcha".
• "Har bir skript xatosi uchun bildirishnomani ko'rsatish" katagiga belgini olib tashlang. O'zgartirishlaringizni saqlang.

Agar foydalanuvchi skriptni tuzatishni o'chirib qo'ygan bo'lsa, xato haqida bildirishnoma endi ko'rinmaydi. Sahifa baribir muzlatib qo'yadi, shuning uchun bu usul faqat bitta sayt bilan bog'liq muammolar mavjud bo'lsa ishlatilishi mumkin.

Mavjud yangilanishlarni yuklab oling

Skript, shuningdek, tizimning o'zi va Internet Explorer uchun zarur yangilanishlar yo'qligi sababli noto'g'ri ishlashi mumkin. Yangilanish muammoni butunlay hal qilishi mumkin.

Kompyuteringizdagi Yangilash markaziga o'ting va barcha yangilanishlar o'rnatilganligiga ishonch hosil qiling. Agar yo'q bo'lsa, o'rnatishni ishga tushiring.

Tizim registridan foydalanish

Nosozlik Windows yuklanganda, ya'ni kompyuter ishga tushganda paydo bo'lishi mumkin. Bu jiddiy muvaffaqiyatsizlikdan uzoqdir, lekin uni hali ham tuzatish kerak. Tizim reestri o'z zimmasiga oladi. Xatoni tuzatish usuli avvalgilariga qaraganda ancha murakkab. Agar siz yangi bo'lsangiz, bilimdonroq foydalanuvchidan buni siz uchun qilishini so'rang.
1."Ishga tushirish" oynasini ishga tushiring va qatorga regedit buyrug'ini kiriting.

2. Sichqonchaning o'ng tugmasi bilan HKEY_LOCAL_MACHINE blokini bosing va "Ruxsat" ni tanlang.

3. Quyida paydo bo'lgan oynada to'liq kirish va o'qishni o'rnating.

4.Kengaytirilgan variantlarni oching. "O'zgartirish" tugmasini bosing va "Ruxsat berish" ni o'rnating

5. Sozlamalarni saqlashni tasdiqlaymiz. Biz OK tugmasini bosamiz.

6. Qurilmangizni qayta ishga tushiring. Buyruqlar qatoriga qo'ng'iroq qiling. Yakuniy teginish quyidagi buyruqdir: regsvr32 msxml.dll. Klaviaturada Enter tugmasini bosing.

Internet Explorer-da skript xatosi ko'p jihatdan hal qilinadi. Biz oddiy va murakkab narsalarni taqdim etdik. Usulni tanlash sababga bog'liq va uni aniqlash unchalik oson emasligi sababli, usuldan keyin usuldan foydalaning.

JavaScript xatolarini tuzatish uchun F12 ishlab chiquvchi vositalaridan foydalanish

Ushbu kontent F12 Developer Tools ning eski versiyasiga havola qiladi. Eng so'nggi F12 hujjatlarini yuklab oling.

F12 vositalari ishlab chiquvchilarga brauzerdan chiqmasdan JavaScript kodini tezda disk raskadrovka qilish imkonini beradi. Windows Internet Explorer 9 ning har bir nusxasiga o'rnatilgan F12 ishlab chiquvchi vositalari uzilish nuqtalari, tomosha va mahalliy o'zgaruvchilarni ko'rish, xabarlar konsoli va darhol kodni bajarish kabi disk raskadrovka vositalarini taqdim etadi.

Ushbu maqola JavaScript kodini disk raskadrovka qilish uchun F12 ishlab chiquvchi vositalaridan qanday foydalanishni o'z ichiga oladi. Ushbu maqola nosozliklarni tuzatish bo'yicha to'liq qo'llanma bo'lishi uchun mo'ljallanmagan, uning maqsadi ishlab chiquvchiga yaratilgan kodni ishga tushirishga yordam beradigan vositalarni ta'kidlashdir. Internet Explorer 9 da tugmani bosing F12 Tuzuvchi vositalarini ochish va yorliqni bosing Ssenariy boshlash uchun.

Yorliqda Ssenariy chap tomonda dasturchi o'zining JavaScript kodini ko'rishi, to'xtash nuqtalarini o'rnatishi va o'z funktsiyalari bo'ylab qadam qo'yishi mumkin bo'lgan manba kodi maydoni. O'ng panelda siz konsol yorliqlari, Ko'rish o'zgaruvchilari, Mahalliy o'zgaruvchilar, Watch Stack va Breakpoints o'rtasida almashishingiz mumkin.

Tuzatish vositasini ishga tushirish va to'xtatish

F12 dasturchi vositalarini birinchi marta ochganingizda va yorliqni bosing Ssenariy, sizning kodingiz chap tomonda va konsol o'ng tomonda paydo bo'ladi. Siz konsolda xabarni ko'rishingiz mumkin: "F12 dasturchi vositasini ochishdan oldin olingan xabarlarni ko'rish uchun sahifani yangilang." Veb-sahifani yangilaganingizda, konsol brauzer tomonidan yuzaga kelgan har qanday xato va ogohlantirishlarni ko'rsatadi.

To'xtash nuqtalarini o'rnatish, boshqaruv va mahalliy o'zgaruvchilarni ko'rish va funktsiyalar ketma-ketligining qo'ng'iroqlar to'plamini ko'rish uchun bosing. Nosozliklarni tuzatishni boshlang. Tugmachani bosish Nosozliklarni tuzatishni boshlang veb-sahifani yangilaydi va tuzatuvchida kodni qayta ishga tushiradi.

Sintaksis va boshqa kod xatolarini topish uchun konsoldan foydalanish

Ko'pgina dasturlash loyihalarida xatolar sintaktik, mantiqiy va ma'lumotlarni kiritish xatolariga bo'linadi. Konsol ko'rinishi JavaScript xatolari va istisnolarini, shuningdek, DOM istisnolarini ko'rsatadi. Kodingiz ichida siz "alert()" yoki mavjud ekran maydoniga qo'ng'iroqlar o'rniga konsolga dastur holati va xato xabarlarini yuborish uchun konsol ob'ektidan foydalanishingiz mumkin. Misol uchun, siz qatorni qo'shishingiz mumkin

Window.console.log("Fayl muvaffaqiyatli ochildi");

Skriptning holati haqida uning bajarilishini to'xtatmasdan ma'lumot olish uchun JavaScript kodingizga kiring. Qo'shimcha ma'lumot: .

Skriptlarning ko'rinishini tuzatish

F12 ishlab chiquvchi vositalari kod qanday ko'rsatilishidan qat'i nazar, JavaScript-ni satr yoki bayonot darajasida disk raskadrovka qilishi mumkin. Siz hatto katta kod blokiga o'xshab siqilgan skriptlarni bosib o'tishingiz mumkin. Ammo ba'zida kod bir blok bo'lsa, mantiqni kuzatib borish qiyin.

Skriptni formatlash uchun tugmani bosing Konfiguratsiya va elementni tanlang JavaScript-ni formatlash. Quyidagi skrinshotlar formatlashdan oldin va keyin JavaScript kod blokini ko'rsatadi.

Kodning bajarilishini to'xtatish

F12 ishlab chiquvchi vositalarida to'xtash nuqtalarini o'rnatish Microsoft Visual Studio kabi ikkilik kodni tuzatuvchilarda to'xtash nuqtalarini o'rnatishga o'xshaydi. Chap panelda to'xtatmoqchi bo'lgan kod qatorining chap tomoniga bosing. To'xtash nuqtalari almashtirilishi mumkin, shuning uchun bosish to'xtash nuqtasini qo'shadi va ikkinchi marta bosish uni olib tashlaydi.

Kodingizga qancha kerak bo'lsa, shuncha ko'p to'xtash nuqtalarini qo'shishingiz mumkin. Siz kod qatorini sichqonchaning o'ng tugmasi bilan bosib, buyruqni tanlashingiz mumkin To'xtash nuqtasini kiriting, yoki toʻxtash nuqtasini oʻrnatmoqchi boʻlgan bayonot yonidagi chap katakchani bosing.

F12 mualliflik vositalaridan foydalanib, siz bayonotlar darajasida to'xtash nuqtasini o'rnatishingiz mumkin, hatto bu bayonotlar bir nechta bayonotlar blokida yoki qatorida bo'lsa ham. Bu siqilgan kod segmentida to'xtash nuqtasini yaratishga imkon beradi. Ushbu shartlar ostida to'xtash nuqtasini o'rnatishning eng yaxshi usuli kodni o'ng tugmasini bosib, uni tanlashdir To'xtash nuqtasini kiriting. Oldin tasvirlangan skript formatlashdan (chiroyli chop etish) foydalanishingiz mumkin, bu esa ularni chekkalarda bosishni osonlashtirish uchun chiziqlarni formatlash orqali amalga oshiriladi.

Breakpoints yorlig'i yordamida bir nechta to'xtash nuqtalarini boshqaring

Ko'p sonli to'xtash nuqtalari yoki hatto bir nechta fayllardan iborat bo'lgan katta hajmdagi kodni ishlatganda, yorliqdan foydalanishingiz mumkin. To'xtash nuqtalari barcha kerakli nuqtalarni kuzatish uchun. Yorliqda Ssenariy yorlig'ini bosing To'xtash nuqtalari mulk yoki o'ng panelda. Misol uchun quyidagi rasmga qarang:

Yorliqda To'xtash nuqtalari ishlab chiquvchi kerakli to'xtash nuqtalarining aniq joylariga o'tmasdan turib to'xtash nuqtalarini yoqishi yoki o'chirib qo'yishi, o'chirishi, tanlashi va nusxalashi mumkin. To'xtash nuqtasini yoqish yoki o'chirish uchun o'zgartirmoqchi bo'lgan sozlama yonidagi katakchani belgilang yoki olib tashlang. Roʻyxatdagi uni ikki marta bosish orqali toʻgʻridan-toʻgʻri kodingizdagi toʻxtash nuqtasiga oʻtishingiz mumkin. Tugmachani bosib bir vaqtning o'zida bir nechta to'xtash nuqtalarini tanlashingiz mumkin CTRL va kerakli to'xtash nuqtalarini bosing.

Yorliqda To'xtash nuqtalari To'xtash nuqtalari guruhlarini o'chirish, yoqish, o'chirish yoki nusxalash uchun kontekst menyusidan (o'ng tugmasini bosish bilan ochiladi) ham foydalanishingiz mumkin. Ushbu parametrlar quyidagi jadvalda ko'rsatilgan.

Menyu elementi	Harakat
Oʻchirish	Qayta tiklash imkoniyatisiz to'xtash nuqtasini o'chirish.
hamma narsani o'chirish	Qayta tiklash imkoniyatisiz barcha to'xtash nuqtalarini o'chirish.
Hammasini yoqing	Ro'yxatdagi barcha katakchalarni belgilash.
Hammasini o'chirib qo'ying	Ro'yxatdagi barcha katakchalarni olib tashlang.
Vaziyat	Bitta nuqta uchun shartli to'xtash nuqtasini o'rnatish imkonini beradi. Agar bir nechta to'xtash nuqtasi tanlangan bo'lsa, bu element mavjud emas.
Nusxalash	Tanlangan to'xtash nuqtalarining tavsif matnini ko'chiradi.
Hammasini belgilash	Roʻyxatdagi barcha toʻxtash nuqtalarini tanlaydi.
Manba kodiga o'ting	Tanlangan to'xtash nuqtasini ko'rsatish uchun kodning chap qismiga o'ting. Agar bir nechta to'xtash nuqtasi tanlangan bo'lsa, bu element mavjud emas.

Shartli uzilish nuqtalari

Kod qatorida shartsiz to'xtash foydalidir, lekin xususiyat yoki o'zgaruvchi ma'lum bir qiymatga yetganda to'xtash yanada kuchliroqdir. Muayyan qiymatga erishilganda yoki o'rnatilganda to'xtatish uchun to'xtash nuqtasi yarating va keyin yorliqni oching To'xtash nuqtalari. Kerakli to'xtash nuqtasini o'ng tugmasini bosing va buyruqni tanlang Vaziyat.

Shartlar dialog oynasida to'g'ri JavaScript bayonotini qo'shing. Bayonot rost deb baholanganda, bajaruvchi kod ushbu to'xtash nuqtasida to'xtaydi. Misol uchun, quyidagi rasmda oAudio.paused xususiyatining qiymati noto'g'ri bo'lganda kod bajarilishi to'xtaydi.

Siz bitta shartni belgilashingiz yoki mantiqiy operatorlardan murakkabroq to'xtash shartini yaratishingiz mumkin. Ammo shuni yodda tutingki, o'zgaruvchilar va ob'ektlar doirasi ular to'xtash nuqtasini ko'rish oynasida ko'rsatilgandek bir xil bo'lib qoladi. Amalga oshirilmagan shartning qiymati rost deb baholanmaydi.

Kod orqali qadam

Kodning bajarilishi to'xtash nuqtasida to'xtaganda, bajarishni davom ettirish uchun o'tish tugmalaridan foydalanishingiz mumkin ( F5), bajarishdagi uzilishlar ( CTRL+SHIFT+B), funksiyaga bosqichma-bosqich kirish ( F11), funksiya o'tkazib yuboradi ( F10) yoki funksiyadan chiqish ( SHIFT+F11). To'xtash nuqtasida bajarilish to'xtatilsa yoki o'tish paytida disk raskadrovka oynasi aslida modal bo'ladi.

Shuning uchun, veb-sahifa bilan ishlashni davom ettirishdan oldin, disk raskadrovkani to'xtatishingiz kerak ( SHIFT+F5) yoki bajarishni davom ettirish ( F5). Agar veb-sahifa javob berishni to'xtatsa, buni yodda tutishingiz kerak. Agar bir nechta oyna ochiq bo'lsa, disk raskadrovka oynasi tepada bo'lmasa, u to'xtash nuqtasida reaktsiyani kutishi mumkin. Bunday holda, veb-sahifani qayta boshqarish uchun ushbu veb-sahifa uchun disk raskadrovka oynasini toping va bosing F5 davom ettirish yoki bosing SHIFT+F5 disk raskadrovkani to'xtatish uchun.

Kuzatuv va mahalliy yorliqlar yordamida o'zgaruvchilarni ko'rish

Tab tomosha qiling disk raskadrovka qilayotgan koddagi tomosha o'zgaruvchilarini aniqlash va ko'rish imkonini beradi. U berilgan o'zgaruvchilarning nomi, qiymati va turini o'z ichiga oladi. Belgilangan qatorni bosishingiz mumkin qo'shish uchun bosing ..., yorliqda Malumot qiymatlari va o'zgaruvchi nomini kiriting. Agar o'zgaruvchi nomini yozishni xohlamasangiz, uni nusxalash va boshqaruv o'zgaruvchilari ro'yxatiga joylashtirishingiz mumkin.

Kuzatuv o'zgaruvchilari ro'yxatidagi qiymatlar kod hozirda disk raskadrovka qilinmoqdami yoki yo'qligidan qat'iy nazar ko'rsatiladi. Nosozliklarni tuzatish yoqilganda va kodni kuzatish yoki to'xtash nuqtalari o'rnatilganda, ro'yxatdagi o'zgaruvchilar qiymatlari doirasi skriptning joriy bajarilish nuqtasi bilan belgilanadi. Nosozliklarni tuzatish o'chirilgan bo'lsa, qamrov global bo'lib, faqat global o'zgaruvchi qiymatlari ko'rsatiladi.

Tabdan farqli o'laroq Malumot qiymatlari, ularning qiymatlari tegishli o'zgaruvchilar doirada yoki yo'qligidan qat'i nazar, yorliqda ko'rsatiladi Mahalliy faqat joriy doiradagi o'zgaruvchilar ko'rsatilgan. Ko'rish uchun o'zgaruvchilarni qo'shishingiz shart emas, chunki siz qamrovni o'zgartirsangiz, ushbu yorliq barcha mavjud o'zgaruvchilarni ko'rsatish uchun yangilanadi.

Farqni ko'rish uchun Internet Explorer 9 da quyidagi misolni oching va berilgan amallarni bajaring.

Yugurish

1. Misolni Internet Explorer 9 da yuklab oling.
2. Tugmasini bosing F12 F12 ishlab chiquvchi vositalarini ochish va yorliqni bosing Ssenariy.
3. Chap panelda birinchi funktsiyaga o'ting, "var a = 5;" qatoriga o'ng tugmasini bosing. va buyruqni tanlang To'xtash nuqtasini kiriting.
4. Tugmasini bosing Nosozliklarni tuzatishni boshlang ni bosing va keyin brauzerdagi veb-sahifada tugmani bosing Yugurish(Bajaring).
5. F12 Developer Tools-da yorliqni bosing Malumot qiymatlari o'ng tomonda va "a, b, c va d." o'zgaruvchilari qo'shing.
6. Tugmachani bosib kodni bosib o'ting F11 yoki tugma Kirish, va yorliqdagi o'zgaruvchilarni ko'ring Malumot qiymatlari.

Har bir funktsiyani bosib o'tishda qidiruv qiymatlari aniqlanmagandan ba'zi qiymatlarga o'zgarishi kerak.

Yorliqdagi farqlarni his qilish uchun Mahalliy, tugmasini bosing F5 F12 ishlab chiquvchi vositalaridan davom etish uchun. Brauzerdagi veb-sahifada tugmani bosing Yugurish Kodni qayta ishga tushirish va F12 ishlab chiquvchi vositalariga qaytish uchun (Ishga tushirish). Yorliqning o'ng tomonida Ssenariy yorlig'ini bosing Mahalliy va tugmani bosing F11 funksiyalar boʻylab yana qadam tashlash uchun. E'tibor bering, mahalliy o'zgaruvchilar ro'yxati faqat qiymatlarga ega bo'lgan o'zgaruvchilarni o'z ichiga oladi. Ko'rinishda Mahalliy u funksiyaga berilgan argumentlarni, ularning qiymati va turini ham ko'rsatadi.

Qo'ng'iroqlar to'plami ko'rinishi

Tab qo'ng'iroqlar to'plami funksiyalarni koddan chaqirishda bosib o'tgan yo'lni ko'rish imkonini beradi. Bu xatolik natijasida yuzaga kelgan kutilmagan kod yoʻlini aniqlashga yordam beradi. Yorliqda qo'ng'iroqlar to'plami har qanday funktsiyani ikki marta bosishingiz va manba kodida uning chaqiruviga o'tishingiz mumkin.

Yuqoridagi misolni sinab ko'ring va yorliqni kuzatib boring qo'ng'iroqlar to'plami funksiyalarni kiritish bilan kodni bosqichma-bosqich bajarishda.

Yorliqda qo'ng'iroqlar to'plami joriy funktsiya yoki joylashuv har doim tepada bo'ladi (yorliqdagi kabi o'q bilan ko'rsatilgan qo'ng'iroqlar to'plami, va kod maydonlarida). Roʻyxatdagi istalgan funksiyani ikki marta bosish funksiyani chaqiruvchi operatorni ajratib koʻrsatadi.

Bir nechta stsenariylarni tuzatish

Katta veb-sahifalar odatda bir nechta JavaScript fayllaridan foydalanadi. F12 ishlab chiquvchi vositalari, xuddi kodni tuzatishda bo'lgani kabi, bir nechta skript fayllari bilan ishlashga imkon beradi. Boshqa faylni ko'rish uchun tugma yonidagi pastga o'qni bosing. Nosozliklarni tuzatishni boshlang ushbu veb-sahifa bilan bog'langan skriptlarni ro'yxatga olish uchun. F12 ishlab chiquvchi vositalaridan foydalanganda kod barcha fayllar bo'ylab bosqichma-bosqich o'tkaziladi. Ko'rish uchun har qanday skript faylidan o'zgaruvchilarni qo'shishingiz mumkin va qo'ng'iroqlar to'plami ko'rinishi turli skript fayllaridagi funktsiyalar orqali bajarilish yo'lini ko'rsatadi.

Hujjat rejimi sozlamalarini o'zgartirish

Hujjat rejimini sozlash chiziqning o'ng tomonida Menyu Har bir F12 ishlab chiquvchi vositalari yorlig'ida mavjud, ammo bu sozlama ayniqsa F12 yorlig'ida kodni tuzatishda foydalidir. Ssenariylar. Internet Explorer 9 Windows Internet Explorer-ning oldingi versiyalari standartlariga taqlid qilish uchun hujjat rejimini o'zgartirishga imkon beradi. Internet Explorer 9 da reklamadan chiqinghujjat turini sukut bo'yicha muvofiqlik rejimiga o'rnatadi. Yangi xususiyat yoki yangi standart bilan ishlashda, masalan, HTML5 da, ba'zi xatolar dasturlash xatolariga o'xshab ko'rinishi mumkin, lekin aslida etishmayotgan yoki noto'g'ri hujjat turi deklaratsiyasidan kelib chiqadi.

Internet Explorer 9 uchun F12 ishlab chiquvchi vositalari kodingizni siz uchun tuzata olmaydi, lekin ular JavaScript xatolarini topishni biroz osonlashtiradi.

Habré-da veb-ishlab chiqishning qiziqarli va murakkab jihatlarini tavsiflovchi ko'plab maqolalar mavjud, ammo ko'plab o'quvchilar veb-dasturchi sifatida o'zlarining kareralarining boshida sizga birinchi qadamni qo'yishga imkon beradigan materiallarni ko'rishni xohlashadi. PHP ni 24 soat ichida” jiddiy darajada rivojlantirish uchun va men bu boradagi tajribam bilan o'rtoqlashmoqchiman.

Veb-ilovaning xususiyatlari uni ikki qismga ajratadi: mijoz va server. Mijoz tomonida JavaScript kodi ishlaydi (ehtimol VBScript-ni ham biror joyda topish mumkin, lekin biz bu ishni ko'rib chiqmasligimiz mumkin), server tomonida - printsipial jihatdan ko'p narsa, lekin biz eng mashhur til bo'lgan PHPni ko'rib chiqamiz. veb-ilovalarning server tomoni uchun. Mijoz tomonida Flash ilovalarini disk raskadrovka qilish va profillash haqida gapirish ham qiziq bo'lardi, lekin o'tilgan mavzu allaqachon keng, shuning uchun uni hozircha qoldiraylik.

HTML kodini tahlil qilish va tekshirish mijoz kodini tuzatish vazifalariga ham tegishli bo'lishi mumkin. Bu butunlay dasturlash sohasidan emas, balki muhim vazifa bo'lib tuyuladi.

Ko'rib chiqilgan vazifalarning ba'zi qismlari allaqachon boshqa maqolalarda ko'rib chiqilgan va men ularga havolalar berganman.

Mijoz kodini tuzatish va profillash

JavaScript kodini disk raskadrovka qilishning “klassik” usuli ogohlantirish funksiyasi va uning hosilalaridan foydalanishdir. Faoliyatimning boshida men shaxsan JavaScript uchun print_r funksiyasini yozganimni eslayman, chunki massivlar va ob'ektlarda disk raskadrovka ma'lumotlarini ko'rsatish imkoniyatini ko'rmadim. Bu shunday ko'rinardi:
print_r(variable) funksiyasi (if (Obyektning massivining oʻzgaruvchan instance || oʻzgaruvchan instance) ( var tugmasi; for (oʻzgaruvchidagi kalit) alert(key + " => " + oʻzgaruvchi); ) else ( alert(variable); ) )

Albatta, hech qanday profillash haqida gap bo'lmadi.

Ushbu yondashuv bilan, hatto konsol ob'ekti haqidagi ma'lumotlar ham inqilobiydir.

Veb-ilovaning mijoz tomonining o'ziga xos xususiyatlari barcha mashhur brauzerlarda kodni tuzatishni talab qiladi. Albatta, ko'pincha Internet Explorer va boshqa har qanday oddiy brauzerda disk raskadrovka etarli, ammo biz barcha variantlarni ko'rib chiqamiz.

Mozilla Firefox

Ehtimol, bu Firefox-ni mijoz kodini tuzatishning kashshofi deb atash mumkin. Uzoq vaqt davomida u Firebug kengaytmasi tufayli ishlab chiqish uchun tanlangan brauzer sifatida ro'yxatga olingan edi, ehtimol u HTML kodini tekshirishdan tashqari barcha kerakli narsalarni o'z ichiga oladi.

Shuningdek, 4-versiyadan boshlab Firebug "Konsol" va "Tarmoq" yorliqlari funktsiyalarining bir qismini, shuningdek, ba'zi CSS disk raskadrovka imkoniyatlarini amalga oshiradigan o'rnatilgan veb-konsol paydo bo'ldi.

6-versiyadan boshlab Simple JavaScript Editor paydo bo'ldi, u ham Firebug funksiyalaridan birini amalga oshiradi va to'g'ridan-to'g'ri brauzerda kod yozish va bajarish imkonini beradi.

10-versiyadan boshlab HTML kodini va CSS xususiyatlarini o'rganishga imkon beruvchi sahifa inspektori paydo bo'ldi, ya'ni HTML yorlig'i funktsiyalarini amalga oshiradi.

Html Validator kengaytmasi odatda HTML kodini tekshirish uchun javobgardir. Faqat habrahabr.ru saytining asosiy sahifasidagi xatolar sonini ko'rsatadigan uning belgisini sahifa inspektori bilan rasmdagi brauzerning pastki o'ng burchagida ko'rish mumkin.

Bundan tashqari, fursatdan foydalanib, shuni ta'kidlaymanki, ushbu brauzer uchun hayotni osonlashtiradigan ko'plab kengaytmalar mavjud bo'lib, ular haqida Habré-da allaqachon tegishli bo'lgan.

Google Chrome va Safari

Ushbu WebKit-ga asoslangan brauzerlar juda yaxshi ishlab chiqilgan va Firebug bilan deyarli bir xil funksiyalarni amalga oshiradigan o'rnatilgan Web Inspektor mualliflik vositasiga ega. Shu bilan birga, biz unga hurmat ko'rsatishimiz kerak, u "katta birodar" da topilgan brauzerni sekinlashtirmaydi.

Chrome brauzerida uni Ctrl+Shift+I tugmalarini bosish yoki oddiygina F12 tugmasini bosish orqali chaqirish mumkin. Safari-da u yaxshi yashiringan va undan foydalanish uchun brauzer sozlamalarida ishlab chiqish parametrlarini yoqishingiz kerak. Keyinchalik, ishlab chiquvchi vositalari asosiy menyuning "Ishlab chiqish" bandidan yoki Ctrl + Alt + I klaviatura yorlig'ini bosish orqali mavjud bo'ladi.

HTML kodini tekshirish uchun siz uchinchi tomon kengaytmalarini ham o'rnatishingiz kerak. Masalan, Chrome uchun bu Validity bo'lishi mumkin. Safari uchun hali hech narsa topilmadi.

Opera

Opera shuningdek, "Opera Dragonfly" deb nomlangan o'rnatilgan dasturchi vositasiga ega bo'lib, uni istalgan vaqtda Ctrl+Shift+I klaviatura yorlig'i yordamida ishlatish mumkin. Bu WebKit bizga taqdim etgan narsaga o'xshaydi va o'xshash xususiyatlar va afzalliklarga ega, garchi mening shaxsiy fikrimcha, bu unchalik qulay emas.

Nosozliklarni tuzatish va server kodini profillash

xdebug

Biz boshida kelishib olganimizdek, biz serverda PHP ishlatilayotgan holatni ko'rib chiqamiz. Bu erda "klassik" disk raskadrovka usullari echo , print_r va var_dump , lekin eng yaxshi uylarda bo'lgani kabi disk raskadrovka vositasi ham mavjud - Xdebug . Shaxsan men uchun institutda o'qishning o'ziga xos xususiyatlaridan kelib chiqib, u "xuddi Delfidagi kabi" ko'rinardi.

Xdebug kengaytmasi sizga hech bo'lmaganda kodni bosib o'tish va o'zgaruvchilar qiymatlarini ko'rish imkonini beradi, bu esa PHP dasturlashni yangi bosqichga olib chiqadi. Xdebug bilan ishlashning nozik tomonlari haqida mos keladigan narsa bor edi. XDebug odatda GNU/Linux omborlarida mavjud, Windows-da dll faylini nusxalash orqali o'rnatish unchalik qiyin emas.

Ushbu kengaytmadan foydalanganda, serverdan ishlab chiquvchi kompyuterga kiruvchi ulanish olinadi (sukut bo'yicha, 9000 portda), uni qayta ishlash kerak. Buni amalga oshirish uchun siz IDE-ni mos ravishda sozlashingiz kerak.

Aytgancha, IDE dan foydalanish ham oldinga siljish uchun zaruriy shartdir. Ba'zi dasturchilar kod bilan ajratilgan bloknotda va IDEda dasturlash o'rtasidagi farqni faqat yirik loyihalarda ko'rish mumkin, deb hisoblashadi, lekin shaxsan men bu farqni hatto "Salom dunyo!" dasturida ham ko'rish mumkin degan fikrdaman. - standart funktsiyalarning nomlari va argumentlarini bitta avtomatik almashtirish biror narsaga arziydi.

XHProf

Kengaytma haqida

Ha, xdebug profil yaratish imkoniyatlarini taqdim etadi, lekin shaxsan menga Facebook-ning shu maqsadlar uchun ishlab chiqilishi yoqadi, XHProf. Rostini aytsam, men hech qanday test o'tkazmadim, lekin bu kengaytma ishlab chiqarish serverlari va haqiqiy yuklar ostida profil yaratish uchun ancha mos keladi.

O'rnatish

Afsuski, bu kengaytma hech qanday omborga kiritilmagan. U PECL ga kiritilgan, ammo ba'zi sabablarga ko'ra uning muntazam o'rnatilishi ko'pincha muammolarni keltirib chiqaradi. Shu sababli, siz manbadan o'rnatishingiz kerak.

# Wget manbalarini oling http://pecl.php.net/get/xhprof-0.9.2.tgz # Manbalarni oching tar -xvf xhprof-0.9.2.tgz # cd xhprof- kengaytma kodini o'z ichiga olgan katalogga o'ting 0.9.2/kengaytma/ # phpize kompilyatsiya qiling va sinab ko'ring ./configure make make test # Civilly checkinstall-ni o'rnating
Xhprof.ini konfiguratsiya fayli bizga shunday narsani beradi:

extension=/usr/local/lib/php/extensions/no-debug-non-zts-20090626/xhprof.so
; Jurnallar uchun katalog
xhprof.output_dir="/var/log/xhprof/"

Profil yaratish

Arxivni ochish orqali biz qo'lga kiritadigan katalog kengaytma manbalariga qo'shimcha ravishda profillash natijalarini o'rganish uchun veb-interfeysni va ilovani profillash uchun kutubxonalarni o'z ichiga oladi.

Keling, profil yaratishga misol keltiraylik. Ilova kodiga quyidagi elementlar kiritilishi kerak:
// Skript boshida, protsessor va xotira yukining profilini // yoqing xhprof_enable(XHPROF_FLAGS_CPU + XHPROF_FLAGS_MEMORY); /* * Asosiy dastur kodi */ // Skript tugaydi, profilni tugating, // natijani jurnalga yozing $xhprofData = xhprof_disable(); include_once XHPROF_DIR."/xhprof_lib/utils/xhprof_lib.php"; include_once XHPROF_DIR."/xhprof_lib/utils/xhprof_runs.php"; $xhprofRuns = yangi XHProfRuns_Default(); $namespace = "ba'zi noyob nom"; $runId = $xhprofRuns->save_run($xhprofData, $namespace); aks-sado "\n";
Bu erda XHPROF_DIR doimiysi yuklab olingan arxivni ochgan katalogga ishora qiladi.

Natijalarni tahlil qilish uchun sizga bir xil veb-interfeys kerak bo'ladi. Uni $XHPROF_DIR/xhprof_html/ katalogida topish mumkin - keling, uni an'anaviy tarzda shunday belgilaymiz. Misol uchun, biz uni veb-serverga kirish mumkin bo'lgan joyda joylashtirdik va u example.com/system/xhprof/ saytida mavjud, keyin ish natijasini tahlil qilish uchun unga quyidagi tarzda kirishimiz kerak:

Example.com/system/xhprof/?run=%runId%&source=%namespace%

Biz shunga o'xshash natijaga erishamiz:

Profillash doimiy ravishda dastur kodiga kiritilishi mumkin yoki, masalan, ma'lum bir ehtimollik bilan yoki ma'lum bir shart mavjudligi bilan uni tasodifiy ishga tushirishingiz mumkin. Masalan, bu kabi:

$needProfiler = (mt_rand(0, 100)< 10 or isset($_COOKIE["xhprof"])); if ($needProfiler) xhprof_enable(XHPROF_FLAGS_CPU + XHPROF_FLAGS_MEMORY);
Bunday holda, siz mijozlarning shikoyatlari yoki shubhalari bilan ma'lum vaqt oralig'ida profillash natijalariga murojaat qilishingiz mumkin. Nomlar maydoni parametridan foydalanib, dasturning qaysi qismi (qaysi skript, kontroller, harakat) profillanganligini aniqlashingiz mumkin.

SQL so'rovlarini profillash

Qoidaga ko'ra, dasturdagi muammo bu ma'lumotlar bazasi bilan ishlashdir. Shu sababli, so'rovlar profilini yaratish tavsiya etiladi. Misol uchun, MySQL kengaytmasi funktsiyalari atrofida o'ralgan sinfning bir qismini ko'rib chiqing. Ha, men bu kengaytmani unchalik yaxshi ko'rmasligini bilaman va uning eski IE6-dan kam bo'lmagan o'limini tilayman. Men undan foydalanishga undamayman, shunchaki bunday sinf mening qo'limda.

/** * Soʻrov * @param string $sql soʻrov * @param massivi $params Parametrlar * @param string $query Kompilyatsiya qilingan soʻrov * @qaytish massivi Natija */ umumiy funksiya soʻrovi($sql, massiv $params = array(), & $query = "") ( $start = microtime(TRUE); // "himoya" parametri bilan birga so'rovni bajaring $stop = microtime(TRUE); $time = $stop - $start; $this->_addProfilerData($ sql , $time); // Natijani qaytarish ) xususiy funksiya _addProfilerData($query, $time) ( if (is_array(self::$profilerData)) ( self::$profilerData = array("query" => $query, " time" => $time); ) ) umumiy funksiya __destruct() ( if (is_array(self::$profilerData)) ( $this->_writeProfilerData(); self::$profilerData = FALSE; ) // Ulanishni uzish ma'lumotlar bazasi ) xususiy funktsiya _writeProfilerData() ( $values ​​= array(); foreach (self::$profilerData sifatida $row) ( $query = mysql_real_escape_string($row["query"], $this->con); $time = ( float)$row["time"]; $hash = crc32($row["query"]); $values ​​= "($hash, "$query", $time)"; ) if ($values) ( $strValues ​​= implode(", ", $values); $sql = "QO'YISH KECIKTIRILIK INTO `profiler_queries` (`query_hash`, `query`, `ish_time`) VALUES $strValues"; @mysql_query($sql, $this->con); ))
Bu erda so'rovlar profili ma'lumotlari profiler_queries jadvalida saqlanadi. Ushbu jadval MyISAM yoki Arxiv turiga ega bo'lishi mumkin, chunki ular dangasa qo'shimchalarni bajarish imkoniyatini beradi, bu esa profil yaratishda javob berishda keraksiz kechikishlarni yaratmaydi. Bundan tashqari, jadvaldagi so'rovlarni yaxshiroq qidirish uchun INT turidagi ustunni yaratish yaxshiroqdir, bu erda so'rovning crc32 xeshi yoziladi, unda indeks yaratmoqchisiz.

Xulosa

Maqola juda katta. Ehtimol, bu erda men yuqoriga o'tib, allaqachon ko'rib chiqilgan mavzularga to'xtalib o'tdim, lekin agar men o'z vaqtida shunga o'xshash narsani o'qiganimda - barcha ma'lumotlar birlashtirilgan va foydali havolalar berilgan maqolani o'qiganimda, bu juda qimmatli bo'lar edi. menga yordam bering. Umid qilamanki, mening maqolam kimgadir ma'rifat yo'lida yordam beradi.

Albatta, boshqalar ham bor - men ularni albatta eslatib o'taman.

Firefox uchun firebug

Men buni aniq bilmayman yong'in qo'ziqorini boshqa ishlab chiquvchi vositalarining asoschisi, lekin u, albatta, eng ommabop, foydalanuvchilar uchun qulay va imkoniyatlarga ega.

Firebug - bu Firefox uchun plagin, ya'ni uni Firefox plaginlari saytidan yuklab olish va o'rnatish kerak.

Yong'inga qarshi qo'ng'iroq qilish uchun F12 tugmasini bosing.

Ushbu qo'shimchaning xususiyatlari:

• dinamik ravishda o'zgaruvchan HTMLni tekshirish va tahrirlash;
• Tezda CSS tahrirlash;
• JavaScript-ni disk raskadrovka qilish, skriptlarni bajarish uchun buyruq qatori;
• Tarmoq so'rovlarini monitoring qilish - siz fayllar va skriptlarning hajmi va yuklab olish vaqtini, so'rov sarlavhalarini ko'rishingiz mumkin;
• DOM tahlilchisi.

Siz bu xususiyatlar haqida uzoq vaqt davomida batafsil gapirishingiz mumkin, lekin menimcha, ular bizning barcha o'quvchilarimizga ma'lum va agar bo'lmasa, batafsil ma'lumot Firebug bosh sahifasida yoki xuddi shu Ilya Kantor tomonidan tarjima qilingan.

Yong'in bug'ining o'zidan tashqari, sizga foydali loson kerak bo'lishi mumkin - firecookie, uning yordamida (syurpriz:-) cookie-fayllarni ko'rishingiz va o'zgartirishingiz mumkin.

Firefox uchun WEB dasturchi asboblar paneli

Ognelisga yana bir foydali qo'shimcha. Bu shunday ko'rinadi:

Keling, nuqtalarni ko'rib chiqaylik.

Oʻchirish

JavaScript-ni o'chirishga, ishlab chiqishda juda foydali bo'lgan keshdan foydalanishni o'chirishga imkon beradi (sahifa so'nggi yangilanishlar bilan yuklanganligiga ishonch hosil qilish imkonini beradi), sahifada ishlatiladigan ranglarni bekor qilish va ularni standart ranglar bilan almashtirish, yo'naltiruvchi sarlavhasida yuborishni o'chiring (o'tish bo'lgan sahifa).

Cookie-fayllar

Cookie fayllari bilan ishlash uchun foydali variant: ularni ko'rish, o'chirish, bloklash va qo'shish mumkin.

css

Ushbu menyuda Dasturchilar asboblar panelining eng zo'r xususiyati - CSS-ni tez tahrirlash mavjud. Bundan tashqari, CSS-ni ko'rish, o'chirish va hokazolarni ko'rish mumkin. Menimcha, bu erda klaviatura yorliqlarining mavjudligi juda foydali (masalan, CTRL + SHIFT + C, darhol sahifa uslublarini ko'rishga o'tish imkonini beradi)

Shakllar

Shakllar bilan ishlash uchun hamma narsa: parollarni ko'rsatish, shakllar haqida ma'lumotni ko'rsatish, forma usullarini aylantirish (GET » POST va aksincha) va boshqalar. Shakl maydonlarini avtomatik ravishda to'ldirish uchun foydali "Forma maydonlarini to'ldirish" foydali funksiyasi (masalan, parolni eslab qolish funksiyasi o'chirilgan bo'lsa, saytni sinab ko'rishda. Aks holda, bu paragrafda men hech qanday foydali narsani ko'rmayapman.

tasvirlar

Tasvirlarni o'chirish uchun foydali funksiya mavjud - saytingiz tasvirlarsiz qanday ko'rinishini ko'rish uchun. Rasmlarni doira ichiga olish, ularning o'lchamlarini ko'rsatish, alt-atributlarni ko'rsatish mumkin.

Ma `lumot

Ushbu menyuda juda ko'p imkoniyatlar mavjud. Sahifada sinf va id atributlarini ko'rsatish foydali bo'lishi mumkin. Bundan tashqari, "Rang haqida ma'lumotni ko'rish" bandi qiziqarli - sahifada ishlatiladigan ranglar haqida tezda ma'lumot olish. "Hujjat hajmini ko'rish" - sahifa hajmini ko'rish. "Javob sarlavhalarini ko'rish" - sahifa sarlavhalarini ko'rish.

Turli xil

Eng ko'p ishlatiladigan xususiyat keshni tozalashdir. Bundan tashqari, bu erda shablonni kesish uchun foydali bo'lishi mumkin bo'lgan "Sahifa o'lchagichi" - o'lchagich, "Sahifa kattalashtiruvchi" - kattalashtiruvchi oyna va "Chiziq qo'llanmalari" - bir nechta chiziqlar mavjud.

kontur

Turli xil sahifa elementlarini tanlash - jadvallar, sarlavhalar, havolalar, ramkalar, bloklar. Oʻlchamini oʻzgartirish har qanday standart ekran kengaytmalariga mos keladigan brauzer oynasining oʻlchamini oʻzgartirish imkonini beradi. Bu yerdagi asboblar sahifani tekshirish uchun saqlangan xususiyatlardir. Ham mahalliy, ham tashqi. HTML, CSS va boshqalarni tekshirish uchun qulay va tezkor kirish. HTMLni tekshirish uchun CTRL+SHIFT+H klaviatura yorliqlaridan foydalanishingiz mumkin.

manbani ko'rish

Manba kodini ko'rish. Tashqi ilovada ko'rish, yaratilgan kodni ko'rish imkoniyati.

O'ngdagisi mening eng sevimlisi. Bu tezkor HTML, CSS validator va JavaScript xato ko'rsatkichi. Muammo bo'lmasa, belgi yashil rangda, agar muammolar mavjud bo'lsa, qizil rangda.

Internet Explorer dasturchi asboblar paneli

8.0 dan boshlab xatolarni tuzatish allaqachon ushbu brauzerda o'rnatilgan. Bu oson chaqiriladi F12 tugmasi. To'g'ri, u 90-yillarning dasturi sifatida baxtsiz.

Ammo bu brauzer uchun ancha sovuqroq vosita bor, Internet Explorer Developer asboblar paneli deb ataladigan havoladan yuklab olish mumkin.

Tashqi ko'rinishiga ko'ra, ushbu asboblar paneli, albatta, yong'inga o'xshaydi, lekin, afsuski, u hali o'smagan. Garchi, boshqa tomondan, u yong'inga qarshi bo'lmagan ba'zi xususiyatlarga ega. Men Internet Explorer Developer asboblar panelini Firebug gibridini va firefox veb-ishlab chiqaruvchisi Asboblar paneli.

Firebug-da bo'lgani kabi, elementni oddiy bosish bilan tekshirish mumkin. Ammo, agar biz darhol to'ldirish va chekkalarni ko'ra olsak, bu erda bunday imkoniyat yo'q.

Bundan tashqari, Internet Explorer Developer asboblar paneli Firebug kabi elementlar daraxtini dinamik ravishda yangilamaydi. Ya'ni, js yordamida sahifadagi biror narsani o'zgartirsak, biz ushbu asboblar paneli yordamida hech narsani ko'rmaymiz.

Siz bahramand bo'lishingiz mumkin bo'lgan narsalardan - CSS-ni tezda o'zgartirish (nimani buzishni topishning oson yo'li :), CSS va tasvirlarni o'chirish, keshni tezda tozalash va cookie-fayllar bilan o'ynash qobiliyati, tekshirishga tezkor kirish.

Eng mazali: o'rnatilgan rang tanlash moslamasi mavjud bo'lib, u sizga tomchi tomchi yordamida sahifadan istalgan rangni olish imkonini beradi. (ff uchun alohida ColorZilla plagini mavjud).

Internet Explorer uchun disk raskadrovka paneli

Berilgan havoladan Internet Explorer uchun DebugBar dasturini yuklab olishingiz mumkin.

O'ziga xos qiziqarli kengaytma. Brauzerga qo'shimcha panel sifatida o'rnatilgan:

Ba'zi sabablarga ko'ra, o'rnatilgan qidiruv tizimi, ko'z tomchisi, oynaning o'lchamini o'zgartirish qobiliyati va yana, negadir, do'stingizga sovun uchun sahifa yuborish imkoniyati mavjud. Foydali bo'lishi mumkin bo'lsa-da. Ammo bu imkoniyatdan foydalana olmadim.

Bundan tashqari, inspektor bor:

Bosish yoki ishora qilish orqali tekshirish usuli ishlab chiquvchilarga mos kelmadi: ular qiziqroq narsani o'ylab topishdi. DebugBar-da maqsadni daraxtda ko'rish uchun kerakli elementga sudrab o'tishingiz kerak. CSS-ni tahrirlash imkoniyati yo'q. Ammo validator va o'rnatilgan JS konsoli mavjud.

Va agar siz sozlamalarni o'rgansangiz, buni topishingiz mumkin:

Ham kulgili, ham qayg'uli.

Ma'lumki, Developer asboblar paneli sakkizinchi tadqiqotchiga o'rnatiladi. Bu uchinchi xatboshida tasvirlanganga o'xshash bo'ladi, lekin biz bu yaxshiroq bo'ladi deb umid qilamiz.

Opera uchun DragonFly diskini tuzatish

DragonFly Opera-ga 9.5 versiyasidan beri o'rnatilgan, shuning uchun uni o'rnatishga hojat yo'q. Dragonfly-ni faollashtirish uchun Asboblar → Kengaytirilgan → Tuzuvchi vositalariga o'ting. Va agar ingliz tilida bo'lsa, u holda Tools → Advanced → Developer Tools.

Darhol sizni DragonFly Alpha2 bosqichida ekanligi haqida ogohlantiraman, bu uning ko'plab nosozliklarini tushuntiradi.

Xususiyatlar ro'yxati:

• DOM inspektori;
• Tekshirish tugmasini bosing (yana FireFox-dagi kabi to'ldirishni ko'rmaymiz);
• Tahrirlash;
• Xato konsoliga tezkor kirish.

DF - bu ramkadagi alohida sahifaga o'xshash narsa. Agar siz uni ochsangiz, u barcha yorliqlar uchun ochiq bo'ladi (yong'in bug'idan farqli o'laroq). Shuning uchun, elementni tekshirishdan oldin, biz ro'yxatdan ko'rmoqchi bo'lgan sahifani tanlashimiz kerak.

Afsuski, bu erda, Internet Explorer-da bo'lgani kabi, Dav asboblar paneli dinamik ravishda yaratilgan elementlarni ko'rsatmaydi. Va umuman olganda, biz sahifani tekshirganimizda, hech qanday JavaScript ishga tushmaydi: havolalar va tugmalar bosilmaydi. Umid qilamizki, DragonFly nashrga yaqinlashganda, biz ushbu xususiyatlarning barchasini ko'ramiz.

Safari-da WEB inspektorini tuzatish

Men darhol brauzer haqida aytaman safari Men ma'lumotni hushtakboz qildim, shuning uchun ular aytganidek, men materialning etarliligi uchun javobgar emasman.

Safari menyusidagi "Rivojlanish" bandini yoqish uchun sozlamalarda mos keladigan elementni yoqishingiz kerak ("Kengaytirilgan" yorlig'i):

"Rivojlanish" menyusida biz uchun quyidagi funksiyalar mavjud:

Keling, WEB inspektorini batafsil ko'rib chiqaylik:

Odatiy bo'lib, inspektor HTML ko'rish rejimida ochiladi. Ammo uni DOM ko'rish rejimiga o'tkazish mumkin. Buning uchun yuqori plastinkada kalit mavjud. Inspektordagi element ustiga kursorni olib kelsangiz, u sahifaning o'zida ajratib ko'rsatiladi. Siz tezda toʻldirishni koʻra olmaysiz, belgilarni yoki CSS-ni oʻzgartira olmaysiz yoki DOME-dagi dinamik oʻzgarishlarni FireBug-da koʻra olmaysiz. Lekin, ko'ryapsizmi, bu juda chiroyli ko'rinadi.

Agar siz inspektor bilan brauzer oynasida ishlashni istasangiz, pastki chap burchakdagi tugmani bosishingiz mumkin.

Safari-da ham "Tarmoq vaqt jadvali" kabi funksiya mavjud (inspektordagi "Tarmoq" tugmasi):

Fayllar qachon va qancha vaqt yuklanganligini aniq ko'rishingiz mumkin. Siz so'rov sarlavhalarini ham ko'rishingiz mumkin, ammo, afsuski, kontentning o'zini ko'ra olmaysiz.

Google Chrome-da dasturchilar uchun disk raskadrovka

Cho'loq ilg'or shaklda tug'ilgan va u hozircha qiyshiq bo'lsa-da, lekin hali ham ishlab chiquvchilar uchun vositalarga ega.

• DOM inspektori;
• javascript tuzatuvchisi;
• JavaScript konsoli.

Elementni tekshirish uchun uni sichqonchaning o'ng tugmasi bilan bosing va kontekst menyusida "Element kodini ko'rish" -ni tanlang:

Funktsionallik Safari bilan bir xil: elementlar sichqonchani ko'targanda ajratib ko'rsatiladi, ammo CSS va HTML tahrirlari mavjud emas, DOM-dagi o'zgarishlar kuzatilmaydi. Faqat, pastki chap burchakdagi inspektorni brauzer oynasiga biriktirishi kerak bo'lgan tugma ishlamaydi.

"Resurslar" yorlig'ida biz quyidagilarni ko'rishimiz mumkin:

Safaridagi o'lchovdan bir oz farq qiladi. Ushbu diagrammadagi shaffoflar nisbiy fayl o'lchamlari va to'liq rang yuklab olish vaqtidir. Qanday bo'lmasin, Chrome-ning bu qismi hali tugallanmaganligi aniq.

Ushbu maqolada men brauzerlar uchun eng mashhur kengaytmalar va o'rnatilgan vositalarni ko'rib chiqdim.

Boshqalar ham bor, masalan:

• Internet Explorer WEB Development Helper - ASP.NET dasturchilari uchun yaxshi yordamchi (Internet Explorer);
• WEB Developer asboblar paneli - Internet Explorer va FireFox uchun asboblar paneli. Bir nechta foydali xususiyatlar mavjud;
• WEB Accessibility asboblar paneli - Internet Explorer uchun asboblar paneli. Hech narsa qiziq emas.

Agar men eslatib o'tmagan, lekin bunga arziydigan qo'shimchalar bo'lsa yoki men o'tkazib yuborgan yuqorida aytib o'tilgan kengaytmalar uchun funktsiyalar mavjud bo'lsa, yozing.

Sog'lik uchun foydalaning!