Эффект «картинка в картинке»: обсуждение использования тегов IFRAME.
Автор:Eve Cole
Время обновления:2009-06-11 17:24:01
Глядя на текущий веб-сайт, скорость Интернета немного медленная, но почти на каждой странице есть много похожих вещей, таких как баннеры, изображения столбцов, авторские права и т. д. Конечно, из-за необходимости единого стиля сайта и рекламного эффекта. , в этом нет ничего страшного. Но ведь кошельки пользователей все больше высасывают деньги из-за этих "приукрашенных" вещей." Есть ли способ сделать так, чтобы эти подобные вещи уже не нужно было скачивать после одной загрузки, а только скачивать? веб-контент в тех областях, где контент изменился?
Ответ однозначный: применить тег Iframe!
1. Использование тегов Iframe <BR> Когда дело касается Iframe, вы, возможно, отбросили его в «забытый угол», но когда дело доходит до его брата Frame, вы не останетесь незнакомым. Тег фрейма — это тег фрейма. То, что мы называем многофреймовой структурой, предназначено для отображения нескольких файлов HTML в окне браузера. Теперь мы сталкиваемся с очень реалистичной ситуацией: если есть учебник, он разделен на разделы один за другим. В конце каждой страницы есть ссылки на «предыдущий раздел» и «следующий раздел», кроме содержимого. Каждое руководство отличается. Кроме того, содержимое других частей страницы одинаково. Кажется, слишком скучно создавать глупые страницы, страница за страницей. В этот момент я внезапно подумал, есть ли способ сохранить другие части. страница не изменится, просто создайте учебник. Она становится страницей с постраничным содержанием без другого контента. При нажатии на ссылку вверх и вниз по странице изменяется только часть содержимого учебника, а остальные части остаются неизменными. таким образом, одно экономит время, а другое заключается в том, что в будущем в учебнике будет три длинных и два коротких изменения, что тоже очень удобно и не затронет всю армию, что более важно, рекламные баннеры, списки столбцов, навигация и другие элементы, которые включены почти в каждую страницу, загружаются только один раз, а затем больше не загружаются.
Тег iframe, также называемый тегом плавающей рамки, вы можете использовать его для встраивания HTML-документа в HTML-дисплей. Самая большая особенность, которая отличается от тега Frame, заключается в том, что файл HTML, на который ссылается этот тег, не отображается независимо от других файлов HTML, а может быть непосредственно встроен в файл HTML и интегрирован с содержимым файла HTML, чтобы стать единым целым. Кроме того, вы также можете отображать один и тот же контент несколько раз на странице без необходимости многократного написания контента. Яркая метафора — телевидение «картинка в картинке».
Теперь поговорим об использовании тегов iframe.
Формат использования тега Iframe:
<Iframe src="URL" width="x" height="x" прокрутка="[OPTION]"frameborder="x"></iframe>
src: путь к файлу, который может быть файлом HTML, текстом, ASP и т. д.;
ширина, высота: ширина и высота области «картинка в картинке»;
прокрутка: если указанный HTML-файл SRC не отображается в указанной области, для параметра прокрутки, если установлено значение «НЕТ», полоса прокрутки не появится, если установлено значение «Авто»: полоса прокрутки появится автоматически, если установлено значение «Да»; оно будет отображаться;
FrameBorder: Ширина границы области. Чтобы смешать «картинку в картинке» с соседним содержимым, ей часто присваивается значение 0.
например:
<Iframe src="http://netschool.cpcw.com/homepage" width="250" height="200" прокрутка="no" Frameborder="0"></iframe>
2. Взаимный контроль между родительской формой и плавающим фреймом <BR> В языке сценариев и иерархии объектов окно, содержащее Iframe, называется родительской формой, а плавающий фрейм называется дочерней формой. важно, поскольку для доступа к дочерней форме в родительской форме или наоборот необходимо знать иерархию объектов, прежде чем вы сможете получить доступ к форме и управлять ею программно.
1. Доступ к объектам подчиненной формы и управление ими в родительской форме <BR> В родительской форме Iframe, то есть подчиненная форма, является дочерним объектом объекта документа. Вы можете напрямую обращаться к объектам в подчиненной форме в. сценарий.
Теперь возникает вопрос, а именно, как нам управлять этим Iframe. Здесь нужно поговорить об объекте Iframe. Когда мы устанавливаем атрибут ID для этого тега, мы можем выполнять ряд элементов управления HTML, содержащимся в Iframe, через DOM объектной модели документа.
Например, встройте файл test.htm в example.htm и управляйте некоторыми объектами тегов в test.htm:
<Iframe src="test.htm" id="test" width="250" height="200" прокрутка="no" Frameborder="0"></iframe>
Код файла test.htm:
<html>
<тело>
<h1 id="myH1">привет, мой мальчик</h1>
</тело>
</html>
Если мы хотим изменить текст в теге H1 с идентификационным номером myH1 на «Привет, моя дорогая», мы можем использовать:
document.myH1.innerText="привет, дорогая"(документ можно опустить)
В файле example.htm подформа, на которую указывает объект метки Iframe, соответствует общей объектной модели DHTML, а метод управления доступом к объекту тот же, поэтому я не буду вдаваться в подробности.
2. Доступ и управление объектами родительской формы в подформе <BR> В подформе мы можем обращаться к объектам в родительском окне через его родительский (родительский) объект.
Например, example.htm:
<html>
<body onclick="alert(tt.myH1.innerHTML)">
<Iframe name="tt" src="frame1.htm" width="250" height="200" прокрутка="no" Frameborder="0"></iframe>
<h1 id="myH2">привет, моя жена</h1>
</тело>
</html>
Если мы хотим получить доступ к тексту заголовка вframe1.htm с идентификационным номером myH2 и изменить его на «привет, мой друг», мы можем написать так: родитель.myH2.innerText="привет, мой друг"
Здесь родительский объект представляет текущую форму (форму, в которой находится example.htm). Доступ к объектам родительской формы в дочерней форме без исключения осуществляется через родительский объект.
Хотя Iframe встроен в другой файл HTML, он остается относительно независимым и представляет собой «независимое царство». Характеристики одного HTML также применимы к плавающим фреймам.
Представьте себе, что с помощью тега Iframe мы можем выразить неизмененный контент как Iframe. Таким образом, нам не придется повторно писать один и тот же контент. Это немного похоже на процесс или функцию в программировании, и насколько это утомительно. ручной труд экономится! Кроме того, что очень важно, это делает модификацию страниц более осуществимой, поскольку вместо того, чтобы изменять каждую страницу для настройки макета, вам нужно изменить макет только одной родительской формы.
Следует отметить, что браузер Nestscape не поддерживает тег Iframe, но в современном мире IE это не имеет большого значения. Теги Iframe широко используются не только сами по себе (на веб-сайте). но и для пользователей сети, чтобы сэкономить на интернет-платеже. Почему бы и нет?