Тег iframe может создать встроенный кадр на веб -странице, который вызывает содержимое другого документа веб -страницы, указав атрибут SRC. Как и Frameset, он используется для разделения структуры веб -страницы, чтобы держать некоторые части веб -страницы публично, но по сравнению с структурой структуры Frameset, разделяющей всю веб -страницу, iframes более гибки и могут быть встроены в любом месте на веб -странице. Из -за этой функции использования IFRAME он широко использовался на некоторых веб -страницах, что также привело к некоторому неуместному насилию. Веб -дизайн проанализирует несколько распространенных способов использования веб -элемента iframe.
- Создание компонента страницы без обновления в качестве решения для асинхронного обмена данными. Это альтернативный метод для отправки запросов асинхронно без использования Ajax в первые дни. Установив невидимый элемент iframe на странице и указав свой атрибут SRC на адрес страницы, где необходимо отправить запрос, запрос может быть отправлен. В том же домене возвращаемая страница может быть проанализирована для получения данных. Другое преимущество заключается в том, что он обходит модель безопасности песочницей AJAX и может успешно отправлять перекрестные запросы для получения данных, но в этом случае объект документа IFRAME не может быть извлечен. Из-за своей характеристики он все еще применим на некоторых веб-страницах, которые требуют перекрестных запросов. Этот вид обновления означает, что родительская страница не обновляется во время процесса обмена данными и продолжает реагировать на операции пользователей. Фактический обмен данными заблокирован страницей iframe, встроенной на родительскую страницу. Эта встроенная страница iframe может быть установлена для того, чтобы быть видимым или невидимым по мере необходимости, и не повлияет на ответ других элементов на родительской странице на пользователь. Этот эффект похож на обновление Ajax, но видно, что его механизм совершенно другой. Несмотря на то, что Gmail является моделью для приложений Ajax, он объединяет множество iframes для достижения своей превосходной производительности и пользовательского опыта.
- Способ оптимизировать страницу. Используйте iframes для загрузки сценариев параллельно, чтобы решить проблемы с загрузкой стороннего содержимого стороннего нагрузки, такого как значки и реклама. Рекламная платформа Google AdSense означает использование iframe для обмена доходами на веб -сайтах пользователей. Вы также можете увидеть такую технологию, просмотрев и анализируя рекламные коды на домашней странице внутреннего портала. Вы также можете использовать скрытый iframe для предварительной загрузки более крупных файлов в кэш, когда сеть находится под низким давлением сети, чтобы другие страницы могли его использовать. Концепция предварительной нагрузки может быть проанализирована с использованием Firebug для домашней страницы Google. Вы можете увидеть в теге тела:
Onload = Document.fqfocus (); if (document.images) New Image (). src ='/images/nav_logo4.png '
С таким кодом загруженное изображение NAV_LOGO4.PNG не используется на домашней странице, но при использовании этого изображения на других страницах, таких как список результатов поиска, вам нужно только читать его из кэша, и не нужно его снова загружать.
- В качестве метода взлома плавающего слоя в браузере IE6, чтобы блокировать выбора элементов управления и элементов вспышки. В эпоху Web2.0 технология Lightbox (или толстая коробка) стала популярным эффектом с его хорошим опытом и свежим визуальным опытом. Эта технология фактически использует абсолютно позиционированный плавающий слой, чтобы охватить исходную страницу для представления текстовой информации, изображений, форм или любых других произвольных элементов страницы, заменяя путь в раннем веб-разработке, которые всплывают в браузерах или собственных сообщениях браузеров и элементах управления вводами, часто используются для взаимодействия с пользователями. В старых способах сценарии, которые появляются в новых окнах, часто перехватываются системой блокировки рекламы браузера, а собственные элементы управления сообщением браузера критикуют исследователи пользователя, потому что они прерывают процесс браузера, что приводит к тому, что все страницы и другие веб -страницы просмотра через несколько тегов заблокированы. Как фронт-линейный сетевой фронт-разработчик с строгими требованиями к себе, вы обязательно столкнетесь с этой проблемой в процессе реализации эффекта Lightbox. Абсолютный слой позиционирования не может охватывать элементы управления выбором и вспышку на веб-странице в IE6, и даже если стиль устанавливается на более высокое значение Z-индекса, он будет бесполезен. Это связано с тем, что элемент Select является элементом уровня формы в IE6, а его приоритет намного выше, чем все другие теги HTML. Только iframes того же уровня формы могут покрыть его. Следовательно, разработчики обнаружили, что помещение плавающего слоя в iframe или размещение iframe в плавающем слое может решить эту проблему. К счастью, эта проблема была исправлена в версии обновления IE после IE6, но для IE6, которая по -прежнему имеет долю рынка 50%(статистика на момент публикации), это решение по -прежнему имеет практическое значение.
В дополнение к трем вышеуказанным приложениям некоторые неподходящие приложения также являются общими для элементов iframe. Например, введите слишком много кадров iframe на странице и обновите iframe при нажатии, указав целевой атрибут тега ссылки вне кадра. Это использование похоже на Frameset, достигая цели обмена навигацией. Первоначальное намерение хорошо, но нет никаких сомнений в недостатках. Это приведет к слишком много запросов на страницу. В статье «Лучшие методы ускорения вашего веб -сайта», упомянутая выше, четко гласит, что оптимизация страниц требует минимизации количества iframes, и суммирует три недостатки:
- Даже если контент пуст, он приведет к потере ресурсов (включая клиент и сервер);
- Загрузки на страницу блоков (Blocks Page Onload, и она переводится, поскольку она предотвратит загрузку страницы, здесь есть сомнения) здесь есть сомнения)
- Нет семантики (SEO является важной частью маркетинга веб -сайтов)
В следующей версии HTML5 из XHTML1.0 нет поддержки тега кадров из -за негативного влияния на доступность веб -страницы, что также объясняет некоторые проблемы со стороны.
Кроме того, поскольку встроенный IFRAME не может автоматически адаптироваться к своему внутреннему размеру контента, чтобы сохранить целостность дисплея страницы, также необходимо написать сценарий JavaScript, чтобы мгновенно настроить его размер в соответствии с изменениями в содержании IFRAME. Запросы с несколькими рассеяниями в сочетании с необходимостью корректировки JavaScript сценариев увеличивают риск множественных страниц iframe, работающих на системах. Итак, есть ли хороший способ удержать контент на странице? Серверная сторона давно предоставила нам решения. Включите в ASP и методы потребностей в PHP используются для включения существующего фрагмента кода в программу. Это также может позволить определенной части страницы (например, меню навигации, нижние колонтитулы) быть публичными. Однако после запуска он выводит как полная страница, эффективно уменьшая запросы клиентов, и нет проблем с высокой адаптируемостью iFrames.