diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:42:52 -0500 |
commit | 074785cea106179cb3305637055ab0a009ca74f2 (patch) | |
tree | e6ae371cccd642aa2b67f39752a2cdf1fd4eb040 /files/ru/mozilla/developer_guide/inner_and_outer_windows | |
parent | da78a9e329e272dedb2400b79a3bdeebff387d47 (diff) | |
download | translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.gz translated-content-074785cea106179cb3305637055ab0a009ca74f2.tar.bz2 translated-content-074785cea106179cb3305637055ab0a009ca74f2.zip |
initial commit
Diffstat (limited to 'files/ru/mozilla/developer_guide/inner_and_outer_windows')
-rw-r--r-- | files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html | 44 |
1 files changed, 44 insertions, 0 deletions
diff --git a/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html b/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html new file mode 100644 index 0000000000..4afb11e920 --- /dev/null +++ b/files/ru/mozilla/developer_guide/inner_and_outer_windows/index.html @@ -0,0 +1,44 @@ +--- +title: Внутренние и внешние окна +slug: Mozilla/Developer_guide/Inner_and_outer_windows +translation_of: Mozilla/Developer_guide/Inner_and_outer_windows +--- +<p>{{ draft() }}</p> + +<p>В этой статье мы попытаемся объяснить понятия внутренних и внешних окон.</p> + +<p>Считайте, что когда пользователь смотрит на документ в окне браузера, может измениться не только документ, который пользователь просматривает в данный момент, но и его содержимое. Затем добавьте к этому понятие рамки, в которых документ в окне может сам содержать другие документы, которые, в свою очередь, могут содержать больше документов.</p> + +<p>Для того чтобы представить эти уровни сложности, необходимо рассмотреть два "типа" окон. Технически они относятся не к окнам в том виде, в каком их видит пользователь, а скорее к тому, на что он смотрит.</p> + +<h2 id="Окна_и_bfcache">Окна и bfcache</h2> + +<p><strong>Внешнее окно</strong> <strong>(outer window) </strong>- это <a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#browsing-context">контекст просмотра</a>, т.е. фактическое окружение, в котором пользователю представляется {{ domxref("Document") }}. Это может быть окно или вкладка, или это может быть {{ HTMLElement("iframe") }}, содержащаяся в другом документе. HTML5 ссылается на внешнее окно как на <a class="external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#the-windowproxy-object" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/browsers.html#the-windowproxy-object"><code>WindowProxy</code></a>.</p> + +<p><strong>Внутреннее окно (inner window) </strong>редставляет реальное отображаемое содержимое; это текущий вид того, что пользователь видит.</p> + +<p>Рассмотрим этот вид окна и историю браузера:</p> + +<p><img alt="window-strip.png" class="default internal" src="/@api/deki/files/4736/=window-strip.png"></p> + +<p>По мере навигации пользователя документы добавляются в обратный кэш (часто называемый <strong>bfcache</strong>). По сути, это внутренние окна. Они отображаются во внешнем окне, которое содержится в "физическом" окне браузера.</p> + +<p>Но вот в чем трюк: внутреннее окно, по сути, претендует на внешнее окно. Если отображаемый в данный момент документ спросит "в каком я окне?", то в качестве ответа он получит внешнее окно. Это позволяет документу взаимодействовать с "физическим" окном, а внешнее окно может отслеживать все документы (внутренние окна), которые в нем содержатся. Другими словами, {{ domxref(" window") }} всегда возвращает внешнее окно.</p> + +<h2 id="Вложенные_окна">Вложенные окна</h2> + +<p>Все становится немного сложнее, если учесть, что документы могут содержать другие документы. Это происходит, например, когда {{ domxref("document") }} содержит {{{ HTMLElement("frame") }} или {{ HTMLElement("iframe") }}. Навигация по самому внешнему документу возможна не только при нажатии на ссылку в одном из фреймов, но и при нажатии на ссылку в этом фрейме.</p> + +<p>Это означает, что должна существовать иерархия внешних и внутренних окон. Рассмотрим документ, в котором есть три элемента {{ HTMLElement("iframe") }}. Иерархия будет выглядеть примерно так:</p> + +<p><img alt="iframes-hierarchy.png" class="default internal" src="/@api/deki/files/4737/=iframes-hierarchy.png"></p> + +<p>На этой диаграмме объекты, с которыми вы взаимодействуете непосредственно в DOM (т.е. {{ domxref("Window") }}, {{ domxref("Document") }}, и {{{ domxref("Element") }}, имеют синий цвет. Серые круги представляют собой более абстрактные внутренние и внешние окна, которые являются реальными объектами, с которыми вы не взаимодействуете напрямую при работе с DOM. Окно в верхней части диаграммы - это внешнее окно.</p> + +<p>По мере того, как пользователь перемещается в каждом из документов в различных рамках, каждое из этих внутренних окон имеет свою собственную историю, которую можно перемещать вперед и назад, как и в предыдущей диаграмме.</p> + +<p>Элемент {{ HTMLElement("iframe") }} содержит свойство contentWindow, которое дает нам объект внешнего окна {{ domxref("Window") }}, содержащий документ кадра. Аналогично свойству contentDocument фрейма передаёт объект {{ domxref("Document") }} внутри фрейма.</p> + +<p>Окно, содержащее фрейм, можно получить из свойства {{ domxref("window.parent") }}.</p> + +<p>Эта иерархия может продолжаться, если фреймы содержат дополнительные кадры.</p> |