Каков наиболее сжатый способ перекрестного браузера для доступа к окну и документу элемента <iframe>?
Я пытаюсь найти лучший способ получить доступ к свойствам <iframe>
element window
и document
с родительской страницы. <iframe>
может быть создан с помощью JavaScript или доступен через ссылку, хранящуюся в свойстве объекта или переменной, поэтому, если я правильно понимаю, это исключает использование document.frames
.
Я видел, как это делалось несколькими способами, но я не уверен в лучшем подходе. При создании <iframe>
, созданного таким образом:
var iframe = document.createElement('iframe');
document.getElementsByTagName('body')[0].appendChild(iframe);
В настоящее время я использую это для доступа к document
, и, похоже, он работает нормально в основных браузерах:
var doc = iframe.contentWindow || iframe.contentDocument;
if (doc.document) {
doc = doc.document;
}
Я также вижу такой подход:
var iframe = document.getElementById('my_iframe');
iframe = (iframe.contentWindow) ? iframe.contentWindow :
(iframe.contentDocument.document) ? iframe.contentDocument.document :
iframe.contentDocument;
iframe.document.open();
iframe.document.write('Hello World!');
iframe.document.close();
Это меня смущает, так как кажется, что если iframe.contentDocument.document
определено, вы попытаетесь получить доступ к iframe.contentDocument.document.document
.
Там также:
var frame_ref = document.getElementsByTagName('iframe')[0];
var iframe_doc = frame_ref.contentWindow ? frame_ref.contentWindow.document :
frame_ref.contentDocument;
В конце концов, я думаю, я запутался в отношении того, какие свойства содержат свойства, будь то contentDocument
эквивалентно document
, или существует ли такое свойство, как contentDocument.document
и т.д.
Может ли кто-нибудь указать мне точную/своевременную ссылку на эти свойства или дать быстрый инструктаж по эффективному доступу к свойствам <iframe>
window
и document
в режиме кросс-браузера (без использования jQuery или другие библиотеки)?
Спасибо за любую помощь!
Ответы
Ответ 1
За это время я провел много тестов и, наконец, придумал этот короткий, но надежный синтаксис, который работает в каждом браузере, который я смог проверить:
var doc = iframe.contentDocument ?
iframe.contentDocument : (iframe.contentWindow.document || iframe.document);
EDIT: @DaggNabbit заметил, что опорная ошибка в iframe.contentWindow.document
, если iframe.contentWindow
не установлена, блокирует выполнение кода, не позволяя возвращать iframe.document
.
Поэтому я уточнил свой код:
var doc = iframe.contentDocument ?
iframe.contentDocument :
(iframe.contentWindow ? iframe.contentWindow.document : iframe.document);
ПРИМЕЧАНИЕ. iframe.document
- это обходной путь для IE5.
Ответ 2
Там более простой способ, который был вокруг дольше... используйте window.frames
, чтобы получить ссылку на объект окна фрейма.
По имени или id:
var iframe_doc = window.frames.my_iframe.document;
или если вы предпочитаете:
var iframe_doc = window.frames['my_iframe'].document;
или по индексу:
var iframe_doc = window.frames[0].document;
Хорошая ссылка для window.frames
здесь: http://developer.mozilla.org/en/DOM/window.frames
Выдержка:
каждый элемент в window.frames pseudo-array представляет окно объект, соответствующий данному < & рама GT; или <iframe> контента, а не элемент (i) кадра DOM (т.е. window.frames [0] - это то же самое как document.getElementsByTagName( "iframe" ) [0].contentWindow)
Ответ 3
все современные браузеры, кроме Chrome, поддерживают как iframereference.contentWindow
, так и iframereference.contentDocument
, но только если страница, открытая в iframe, находится в том же домене, что и страница, содержащая iframe.
Чтобы включить Chrome, используйте var iwin=iframereference.contentWindow,
idoc=iwin.document;
.contentDocument
- это window.document
страницы в iframe,
как contentWindow.document
, но не .contentDocument.document
.
В некоторых будущих версиях Chrome может включать поддержку .contentDocument
. Надеюсь, что так же, как и все другие браузеры найдут документ, содержащийся в элементе Object, введите text/html
, где атрибут data является url страницы html.
Ответ 4
Я думаю, что это очень простой и кросс-браузерный способ.
//get document object of IFRAME
if(typeof frame.contentDocument!='undefined') {
iframeDocument=frame.contentDocument;
} else {
iframeDocument=frame.document;
}
//get window object of IFRAME
if(typeof frame.contentWindow!='undefined') {
iframeWindow=frame.contentWindow;
} else {
iframeWindow=frame.window;
}
вы можете проверить его