Що сильно напружує при роботі з інтерфейсом того чи іншого сайту? Ну, кого-то дизайн. А ще є те, що є основою самої технології. Кожна страніча, коли віддається користувачеві, являє собою звичайний текст, який неможливо змінити. З цього у HTML є маса милиць, для того, щоб зробити сторінки динамічнішими, щоб наступного разу галерея перезапитує сторінку. Милиці ці називаються фреймворкі. Але можна юзати багато фішки не користуючись громіздкими фреймворкамі.
Для підвищення динаміки можна включати одні html-сторінки в інші html-сторінки. При чому не звичайний статичну сторінку, а скрипт. Пр іетом можна перехоплювати події і в залежності від подій виводити потрібну інформацію. Але можна почати з самого банального. А найпростішим у нас буде можливість вставити одну сторінку в іншу сторінку. Зауважу, що вставляється сторінка не обов'язково повинна бути статичною, що підключається сторінка може бути результатом генерації скрипта.
Я розглядаю підключення файлу до вже завантаженої сторінці. По-перше, хотілося б визначитися з типом виведення. Перезапитує сторінку не можна, з цього перемальовувати контент на сторінці ми будемо за допомогою DOM. Тепер потрібно вирішити яким чином відбудеться включення потрібної нам сторінки.
Головне, щоб id контейнерів по всьому документу не перетиналися. Адже id унікальний в діапазоні всього документа! До речі, для інформативності в контейнер можна помістити будь-яке повідомлення. Наприклад фразу: «А зараз вискочить пташка» або фразу: «Зачекайте, йде завантаження». Іноді там поміщають картинку, яка показує, що йде якийсь процес. У будь-якому випадку, бажано якось позначити, що в цьому місці буде виводитися включається контент.
Підключати файл я рекомендую за допомогою об'єкта XMLHTTP для Internet Explorer і об'єкта XMLHttpRequest для інших браузерів типу Mozilla Firefox, Chrom, Opera і інших. Цей об'єкт буде іпользовать для скачування файлу з мережі і виведення його вмісту в створений раніше DIV-шар. Створити об'єкт можна двома методами. М'який і короткий. Короткий підключається в одну строчку і використовується в таких фреймворках як jQwery, Ajaks, Dojo, Yahoo UI і Prototype. А м'який варіант підключення використовує купу винятків.
Я рекомендую м'який тип підключення:
Цей код створює змінну-об'єкт з назвою xmlhttp. З її допомогою можна завантажувати текстові файли і маніпулювати їх вмістом на свій розсуд. У нашому ж випадку, необхідно завантажити текстовий файл і вивести його вміст всередину створеного DIV-шару.
Для скачування файлів використовується функція open. всередину якої передається три параметра. Виклик відбувається наступним чином:
У функцію передаються п'ять парамеров:
Після створення запиту за допомогою функуціі open. його необхідно відправити. Відправляється запит за допомогою функції send. Через цю функцію передаються параметри запиту. Наприклад, у запиту GET, немає параметрів, з цього ми будемо передавати в запит null. Виглядати це буде так:
Про роботу з POST-запитів я напишу пізніше. Вони будуть використовуватися для роботи з Я ндекс.API. Правда це відбудеться не скоро, але я обов'язково поділюся своїм досвідом, після проведення серії експериментів.
І так, плавно підкралися до висновку тексту всередину нашого div-шару. Доступ до вмісту контейнера здійснюється за допомогою наступної конструкції:
Ця конструкція дозволяє замінити вміст контейнера, з ідентифікатором inc_html. на довільний текст. Текст може містити будь-які теги, аж до таблиць і картинок.
Тепер підійдемо до практичної реалізації наміченої задумки. Зауважу, що на локальному комп'ютері подібні ігри не завжди спрацьовують. Для тестування цих прикладів рекомендую використовувати повноцінний сервер.
Розмістимо в корені сервера два файли: out.html і in.txt. Всередину файлу out.html помістимо наступний код:
А в файл in.txt вкарбуємо будь-який текст, наприклад:
В результаті виконання цього прикладу буде виведено наступне:
Як ми бачимо, вміст одного файлу відобразилося всередині іншого файлу.
Я б навіть сказав, що не приклади використання, а які вигоди.
По-перше, блог став рідше рушати роботами. Мабуть сторінки стали статичними і їх ніхто не хотів переіндексувати. По-друге, навантаження на сервер трохи впала при тій-же завантаженні (перший тиждень ніхто з роботів технічно чухнул в чому підступ). По-третє, то чого я і добивався, зменшилася кількість запитів до бази данн.