From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../api/htmliframeelement/contentwindow/index.html | 42 +++ files/zh-cn/web/api/htmliframeelement/index.html | 406 +++++++++++++++++++++ 2 files changed, 448 insertions(+) create mode 100644 files/zh-cn/web/api/htmliframeelement/contentwindow/index.html create mode 100644 files/zh-cn/web/api/htmliframeelement/index.html (limited to 'files/zh-cn/web/api/htmliframeelement') diff --git a/files/zh-cn/web/api/htmliframeelement/contentwindow/index.html b/files/zh-cn/web/api/htmliframeelement/contentwindow/index.html new file mode 100644 index 0000000000..828bbdccc5 --- /dev/null +++ b/files/zh-cn/web/api/htmliframeelement/contentwindow/index.html @@ -0,0 +1,42 @@ +--- +title: HTMLIFrameElement.contentWindow +slug: Web/API/HTMLIFrameElement/contentWindow +translation_of: Web/API/HTMLIFrameElement/contentWindow +--- +
{{APIRef("HTML DOM")}}
+ +

contentWindow 属性返回当前HTMLIFrameElement的Window对象. 你可以使用这个Window 对象去访问这个iframe的文档和它内部的DOM. 这个是可读属性, 但是它的属性像全局Window 一样是可以操作的. 

+ +

关于contentWindow的示例

+ +
var x = document.getElementsByTagName("iframe")[0].contentWindow;
+//x = window.frames[0];
+
+x.document.getElementsByTagName("body")[0].style.backgroundColor = "blue";
+// this would turn the 1st iframe in document blue.
+
+ +

 规范

+ + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('HTML WHATWG', '#dom-iframe-contentwindow', 'HTMLIFrameElement: contentWindow')}}{{Spec2('HTML WHATWG')}}
+ +

浏览器兼容性

+ + + +

{{Compat("api.HTMLIFrameElement.contentWindow")}}

diff --git a/files/zh-cn/web/api/htmliframeelement/index.html b/files/zh-cn/web/api/htmliframeelement/index.html new file mode 100644 index 0000000000..7de15e07df --- /dev/null +++ b/files/zh-cn/web/api/htmliframeelement/index.html @@ -0,0 +1,406 @@ +--- +title: HTMLIFrameElement +slug: Web/API/HTMLIFrameElement +translation_of: Web/API/HTMLIFrameElement +--- +
{{APIRef("HTML DOM")}}
+ +

HTMLIFrameElement 接口提供了除 {{domxref("HTMLElement")}} 之外的一些特殊属性和方法（当然也包括了继承自 {{domxref("HTMLElement")}} 的部分）。这些方法用于操作内联frame元素的布局和展示。

+ +

属性

+ +

继承了来自父类的属性，{{domxref("HTMLElement")}}。

+ +
+
{{domxref("HTMLIFrameElement.align")}} {{obsolete_inline}}
+
一个 {{domxref("DOMString")}} 指定了相对于当前上下文的对齐方式。
+
{{domxref("HTMLIFrameElement.allowfullscreen")}} {{experimental_inline}}
+
一个 {{domxref("Boolean")}} 标识了该内联frame是否愿意被全屏防止。详情请参考 Using full-screen mode 。
+
{{domxref("HTMLIFrameElement.contentDocument")}} {{readonlyInline}}
+
返回一个 {{domxref("Document")}}，该内联frame嵌套的浏览上下文中活跃的document对象。
+
{{domxref("HTMLIFrameElement.contentWindow")}} {{readonlyInline}}
+
返回一个 {{domxref("WindowProxy")}}，该嵌套的浏览上下文中的window代理。
+
{{domxref("HTMLIFrameElement.frameBorder")}} {{obsolete_inline}}
+
一个 {{domxref("DOMString")}} 标识了是否在frame之间创建边框。
+
{{domxref("HTMLIFrameElement.height")}}
+
一个 {{domxref("DOMString")}} 反映着 {{htmlattrxref("height", "iframe")}} HTML 属性，标识了该frame的高度。
+
{{domxref("HTMLIFrameElement.longDesc")}} {{obsolete_inline}}
+
一个 {{domxref("DOMString")}} 包含着该frame的详细描述的URI。
+
{{domxref("HTMLIFrameElement.marginHeight")}} {{obsolete_inline}}
+
一个 {{domxref("DOMString")}} ，该frame的外边距高度。
+
{{domxref("HTMLIFrameElement.marginWidth")}} {{obsolete_inline}}
+
一个 {{domxref("DOMString")}} ，该frame的外边距宽度。
+
{{domxref("HTMLIFrameElement.name")}}
+
一个 {{domxref("DOMString")}} 反映着 {{htmlattrxref("name", "iframe")}} HTML 属性，包含着用来引用该frame的名字。
+
{{domxref("HTMLIFrameElement.referrerPolicy")}} {{experimental_inline}}
+
一个 {{domxref("DOMString")}} 反映着 {{htmlattrxref("referrerPolicy", "iframe")}} HTML 属性，标识了获取关联资源时要使用哪个referrer。
+
{{domxref("HTMLIFrameElement.sandbox")}}
+
一个 {{domxref("DOMSettableTokenList")}} 反映着 {{htmlattrxref("sandbox", "iframe")}} HTML 属性，指示着对嵌套内容额外的限制。
+
{{domxref("HTMLIFrameElement.scrolling")}} {{obsolete_inline}}
+
一个 {{domxref("DOMString")}} 指示着浏览器是否应该为该frame提供滚动条。
+
{{domxref("HTMLIFrameElement.src")}}
+
一个 {{domxref("DOMString")}} 反映着 {{htmlattrxref("src", "iframe")}} HTML 属性，包含被嵌入内容的地址。
+
{{domxref("HTMLIFrameElement.srcdoc")}}
+
一个 {{domxref("DOMString")}} ，表示该frame中要显示的内容。
+
{{domxref("HTMLIFrameElement.width")}}
+
一个 {{domxref("DOMString")}} 反映着 {{htmlattrxref("width", "iframe")}} HTML 属性，标识着该frame的宽度。
+
+ +

方法

+ +

继承了来自父类的属性，{{domxref("HTMLElement")}}。

+ +

浏览器 API 方法

+ +

为支持浏览器{{HTMLElement("iframe")}}的需求，HTMLIFrameElement已经扩展了一些新的方法来让{{HTMLElement("iframe")}}有更多的能力。他们并未成为规范（参见 {{anch("Browser compatibility")}}）。

+ +

导航方法

+ +

以下导航方法允许通过{{HTMLElement("iframe")}}的浏览历史进行导航。他们对于后退、前进、停止和重新加载按钮的实现而言是非常必须的。

+ +
+
{{domxref("HTMLIFrameElement.reload()")}}
+
重新加载{{HTMLElement("iframe")}}元素内容。
+
{{domxref("HTMLIFrameElement.stop()")}}
+
停止加载{{HTMLElement("iframe")}}元素内容。
+
{{domxref("HTMLIFrameElement.getCanGoBack()")}}
+
指示是否可以后退。
+
{{domxref("HTMLIFrameElement.goBack()")}}
+
改变{{HTMLElement("iframe")}}位置到上一个浏览历史记录的位置。
+
{{domxref("HTMLIFrameElement.getCanGoForward()")}}
+
指示是否可以前进。
+
{{domxref("HTMLIFrameElement.goForward()")}}
+
改变{{HTMLElement("iframe")}}位置到下一个浏览历史记录的位置。
+
+ +

管理方法

+ +

这个方法集管理浏览器{{HTMLElement("iframe")}}所用的资源。它们对于实现分页浏览程序非常有用。

+ +
+
{{domxref("HTMLIFrameElement.executeScript()")}}
+
在浏览器{{HTMLElement("iframe")}}页面加载完成后执行指定的脚本。
+
{{domxref("HTMLIFrameElement.purgeHistory()")}}
+
清理所有与浏览器{{HTMLElement("iframe")}}有关的资源（不包括cookie）。
+
{{domxref("HTMLIFrameElement.setVisible()")}}
+
修改浏览器{{HTMLElement("iframe")}}的可见性。这会影响资源分配和一些函数的资源占用率，如{{domxref("window.requestAnimationFrame","requestAnimationFrame")}}。
+
{{domxref("HTMLIFrameElement.getVisible()")}}
+
指示当前浏览器{{HTMLElement("iframe")}}的可见性。
+
{{domxref("HTMLIFrameElement.setActive()")}}
+
设置当前{{HTMLElement("iframe")}}为活动frame，对进程管理器如何划分优先级有影响。
+
{{domxref("HTMLIFrameElement.getActive()")}}
+
指示当前浏览器{{htmlelement("iframe")}}是否为当前活动的frame。
+
{{domxref("HTMLIFrameElement.setInputMethodActive()")}}
+
设置当前浏览器{{HTMLElement("iframe")}}是活动的输入法编辑器窗口而其他不是。当一个顶层应用希望激活一个窗口作为输入法编辑器（如键盘）时有用。
+
{{domxref("HTMLIFrameElement.setNfcFocus()")}}
+
Firefox 操作系统 NFC API 的一部分，扩展了Browser API，这个集合设置浏览器{{htmlelement("iframe")}}是否可以接收一个NFC事件。
+
+ +

音频相关方法

+ +

以下方法允许直接控制浏览器元素的声音。

+ +
+
{{domxref("HTMLIFrameElement.getVolume()")}}
+
获取浏览器{{HTMLElement("iframe")}}当前音量。
+
{{domxref("HTMLIFrameElement.setVolume()")}}
+
设置浏览器{{HTMLElement("iframe")}}当前音量。
+
{{domxref("HTMLIFrameElement.mute()")}}
+
浏览器{{HTMLElement("iframe")}}播放的所有音频静音。
+
{{domxref("HTMLIFrameElement.unmute()")}}
+
取消浏览器{{HTMLElement("iframe")}}播放所有音频的静音。
+
{{domxref("HTMLIFrameElement.getMuted()")}}
+
指示当前浏览器{{HTMLElement("iframe")}}当前是否被静音。
+
+ +

Search methods

+ +

New methods are provided to allow programmatic searches of browser {{HTMLElement("iframe")}}s to be carried out.

+ +
+
{{domxref("HTMLIFrameElement.findAll()")}}
+
Searches for a string in a browser {{HTMLElement("iframe")}}'s content; if found, the first instance of the string relative to the caret position will be highlighted.
+
{{domxref("HTMLIFrameElement.findNext()")}}
+
Highlights the next or previous instance of a search result after a {{domxref("HTMLIFrameElement.findAll","findAll()")}} search has been carried out.
+
{{domxref("HTMLIFrameElement.clearMatch()")}}
+
Clears any content highlighted by {{domxref("HTMLIFrameElement.findAll","findAll()")}} or {{domxref("HTMLIFrameElement.findNext","findNext()")}}.
+
+ + + +

In order to manage the browser {{HTMLElement("iframe")}}'s content, many new events were added (see below). The following methods are used to deal with those events:

+ +
+
The {{HTMLElement("iframe")}} gains support for the methods of the {{domxref("EventTarget")}} interface
+
{{domxref("EventTarget.addEventListener","addEventListener()")}}, {{domxref("EventTarget.removeEventListener","removeEventListener()")}}, and {{domxref("EventTarget.dispatchEvent","dispatchEvent()")}}.
+
{{domxref("HTMLIFrameElement.sendMouseEvent()")}}
+
Sends a {{domxref("MouseEvent")}} to the {{HTMLElement("iframe")}}'s content.
+
{{domxref("HTMLIFrameElement.sendTouchEvent()")}}
+
Sends a {{domxref("TouchEvent")}} to the {{HTMLElement("iframe")}}'s content. Note that this method is available for touch enabled devices only.
+
{{domxref("HTMLIFrameElement.addNextPaintListener()")}}
+
Defines a handler to listen for the next {{event("MozAfterPaint")}} event in the browser {{HTMLElement("iframe")}}.
+
{{domxref("HTMLIFrameElement.removeNextPaintListener()")}}
+
Removes a handler previously set with {{domxref("HTMLIFrameElement.addNextPaintListener","addNextPaintListener()")}}.
+
+ +

Utility methods

+ +

Last, there are some utility methods, useful for apps that host a browser {{HTMLElement("iframe")}}.

+ +
+
{{domxref("HTMLIFrameElement.download()")}}
+
Downloads a specified URL, storing it at the specified filename/path.
+
{{domxref("HTMLIFrameElement.getContentDimensions()")}}
+
Retrieves the X and Y dimensions of the content window.
+
{{domxref("HTMLIFrameElement.getManifest()")}}
+
Retrieves the manifest of an app loaded in the browser {{HTMLElement("iframe")}} and returns it as JSON.
+
{{domxref("HTMLIFrameElement.getScreenshot()")}}
+
Takes a screenshot of the browser {{HTMLElement("iframe")}}'s content. This is particularly useful to get thumbnails of tabs in a tabbed browser app.
+
{{domxref("HTMLIFrameElement.getStructuredData()")}}
+
Retrieves any structured microdata (and hCard and hCalendar microformat data) contained in the HTML loaded in the browser {{HTMLElement("iframe")}} and returns it as JSON.
+
{{domxref("HTMLIFrameElement.zoom()")}}
+
Changes the zoom factor of the browser {{HTMLElement("iframe")}}'s content. This is particularly useful for zooming in/out on non-touch-enabled devices.
+
+ +
+
+ + + + + +

Specifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}{{Spec2('Referrer Policy')}}Added the referrerPolicy property.
{{SpecName('HTML WHATWG', "the-iframe-element.html#the-iframe-element", "HTMLIFrameElement")}}{{Spec2('HTML WHATWG')}}The following property has been added: allowFullscreen.
{{SpecName('HTML5 W3C', "embedded-content-0.html#the-iframe-element", "HTMLIFrameElement")}}{{Spec2('HTML5 W3C')}}The following properties are now obsolete: scrolling, marginWidth, marginHeight, longDesc, frameBorder, and align.
+ The following properties have been added: srcdoc, sandbox, and contentWindow.
{{SpecName('DOM2 HTML', 'html.html#ID-50708718', 'HTMLIFrameElement')}}{{Spec2('DOM2 HTML')}}The contentDocument property has been added.
{{SpecName('DOM1', 'level-one-html.html#ID-50708718', 'HTMLIFrameElement')}}{{Spec2('DOM1')}}Initial definition.
+ +

Browser compatibility

+ +
{{CompatibilityTable}}
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureChromeFirefox (Gecko)Internet ExplorerOperaSafari (WebKit)
Basic support{{CompatVersionUnknown}}{{CompatGeckoDesktop(1.0)}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
srcdoc4{{CompatGeckoDesktop(25)}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
sandbox4{{CompatGeckoDesktop(17)}}[1]{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
contentDocument{{CompatVersionUnknown}}{{CompatVersionUnknown}}8.0[3]{{CompatVersionUnknown}}{{CompatVersionUnknown}}
contentWindow{{CompatUnknown}}{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatUnknown}}{{CompatUnknown}}
allowFullScreen {{experimental_inline}}17 {{property_prefix("-webkit")}}[4]{{CompatGeckoDesktop(9.0)}} {{property_prefix("-moz")}}
+ {{CompatGeckoDesktop(18.0)}}		{{CompatNo}}{{CompatNo}}{{CompatNo}}
referrerPolicy {{experimental_inline}}{{CompatNo}}{{compatGeckoDesktop(50)}}{{CompatNo}}{{CompatNo}}{{CompatNo}}
Browser API methods{{CompatNo}}{{CompatNo}}[5]{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
FeatureAndroidFirefox Mobile (Gecko)Firefox OS (Gecko)IE PhoneOpera MobileSafari Mobile
Basic support{{CompatVersionUnknown}}{{CompatGeckoMobile(1.0)}}1.0.1{{CompatVersionUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
srcdoc4{{CompatGeckoMobile(25)}}1.1{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
sandbox4{{CompatGeckoMobile(17)}}[1]1.0.1{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
seamless {{experimental_inline}}4{{CompatNo}}{{CompatNo}}{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
contentDocument{{CompatVersionUnknown}}{{CompatVersionUnknown}}1.0.1{{CompatUnknown}}{{CompatVersionUnknown}}{{CompatVersionUnknown}}
contentWindow{{CompatUnknown}}{{CompatUnknown}}1.0.1{{CompatUnknown}}{{CompatUnknown}}{{CompatUnknown}}
allowFullScreen {{experimental_inline}}17 {{property_prefix("-webkit")}}[4]{{CompatGeckoMobile(9.0)}} {{property_prefix("-moz")}}
+ {{CompatGeckoMobile(18.0)}}		1.0.1{{CompatNo}}{{CompatNo}}{{CompatNo}}
referrerPolicy {{experimental_inline}}{{CompatNo}}{{compatGeckoMobile(50)}}2.5{{CompatNo}}{{CompatNo}}{{CompatNo}}
Browser API methods{{CompatNo}}{{CompatNo}}1.0.1[2]{{CompatNo}}{{CompatNo}}{{CompatNo}}
+
+ + + +

See also

+ + -- cgit v1.2.3-54-g00ecf