Yashirin matn bloklarini joylashtirish veb-sayt sahifasini vizual idrokini yaxshilaydi - joylashtirilgan ma'lumotlarning hajmidan qat'i nazar, u dizayner tomonidan ishlab chiqilgan tarzda brauzerga yuklanadi. Bundan tashqari, bu mehmon uchun qulayroqdir - kerakli ma'lumot blokini qidirishda u butun massivni ko'rib chiqishi shart emas, faqat kichik "aysberglarning uchlari" ni ko'rib chiqishi kerak.
Bu zarur
HTML va JavaScript haqida asosiy bilimlar
Ko'rsatmalar
1-qadam
HTML-sahifadagi kerakli blok bloklarini yashirish va aks ettirish uchun maxsus JavaScript funktsiyasidan foydalaning. Barcha bloklar uchun umumiy funktsiya ularning har biriga alohida kod qo'shishdan ko'ra ancha qulaydir. Sahifaning manba kodining sarlavha qismida ochish va yopish ssenariy teglarini joylashtiring va ular orasida nom bilan bo'sh funktsiya yarating, masalan, almashtirish va bitta kerakli kirish parametri identifikatori: function swap (id) {}
2-qadam
Jingalak qavslar orasidagi funktsiya tanasiga ikkita satr JavaScript kodini qo'shing. Birinchi satrda matn blokining hozirgi holati o'qilishi kerak - uning ko'rinishi yoki o'chirilishi. Hujjatda bunday bloklar bir nechta bo'lishi mumkin, shuning uchun ularning har biri o'z identifikatoriga ega bo'lishi kerak - bu faqat bitta kirish parametri sifatida idni qabul qiladigan uning funktsiyasi. Ushbu identifikator yordamida sDisplay o'zgaruvchisiga ko'rinish / ko'rinmaslik qiymatini (displey xususiyati holatini) belgilab, hujjatdagi kerakli blokni qidiradi: sDisplay = document.getElementById (id).style.display;
3-qadam
Ikkinchi satr kerakli matn blokining displey xususiyatini teskari tomonga o'zgartirishi kerak - agar matn ko'rinadigan bo'lsa yashirish va uning yashirinligini ko'rsatish. Buni quyidagi kod bilan bajarish mumkin: document.getElementById (id).style.display = sDisplay == 'yo'q'? '': 'yo'q';
4-qadam
Sarlavha qismiga quyidagi uslublar jadvalini qo'shing: a {kursor: ko'rsatgich} Sichqoncha ko'rsatgichini tugallanmagan bog'lanish yorlig'i ustiga olib borishda to'g'ri ko'rsatish uchun sizga bu kerak bo'ladi. Bunday havolalar yordamida siz sahifada matn bloklarining ko'rinishini / ko'rinmasligini o'zgartirishni tashkil qilasiz.
5-qadam
Ushbu o'tish havolalarini har bir yashirin blokdan oldin matnga joylashtiring va matn oxiridagi bloklarga shunga o'xshash havolani qo'shing. Ko'rinmas matnni uslub atributlarida ko'rinmaydigan ko'rinishga ega bo'lgan oraliq teglarga joylashtiring. Masalan: Matnni kengaytirish +++ Bu yashirin matn --- Ushbu misolda uchta ortiqcha havolani bosish onClick hodisasida yuqoridagi funktsiyani chaqiradi va uni ko'rinadigan blok identifikatorini beradi. Blok ichida bir xil funktsiyalarga ega bo'lgan uchta minusning havolasi mavjud - ustiga bosish matnni yashiradi.
6-qadam
Span yorlig'ining id atributidagi va ikkita havoladagi onClick hodisasi tomonidan funktsiyaga o'tkazilgan o'zgaruvchidagi identifikatorlarni o'zgartirishni unutmasdan, oldingi bosqichda tasvirlanganga o'xshash kerakli miqdordagi matn bloklarini yarating.
