HTMLFencedFrameElement

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

实验性: 这是一项实验性技术
在将其用于生产之前,请仔细检查浏览器兼容性表格

HTMLFencedFrameElement 接口表示 Javascript 中的 <fencedframe> 元素,且提供配置属性。

EventTarget Node Element HTMLElement HTMLFencedFrameElement

实例属性

从其父接口 HTMLElement 继承属性。

HTMLFencedFrameElement.allow 实验性

获取并设置对应 <fencedframe> 元素的 allow 属性值,该属性表示内容首次嵌入时应用的权限策略

HTMLFencedFrameElement.config 实验性

一个 FencedFrameConfig 对象,表示 <fencedframe> 的导航,即其中将显示什么内容。FencedFrameConfig 是从诸如受保护的受众 API 等来源返回的。

HTMLFencedFrameElement.height 实验性

获取并设置对应 <fencedframe> 元素的 height 属性的值,该属性指定元素的高度。

HTMLFencedFrameElement.width 实验性

获取并设置对应 <fencedframe> 元素的 width 属性的值,该属性指定元素的宽度。

示例

要设置将在 <fencedframe> 中显示的内容,使用 API(如受保护的受众共享存储)生成一个 FencedFrameConfig 对象,然后将其设置为 <fencedframe>config 属性值。

以下示例从受保护的受众 API 的广告拍卖中获取一个 FencedFrameConfig,然后使用它在 <fencedframe> 中显示获胜的广告:

js
const frameConfig = await navigator.runAdAuction({
  // 拍卖配置
  resolveToConfig: true,
});

const frame = document.createElement("fencedframe");
frame.config = frameConfig;

备注: 在调用 runAdAuction() 时,必须传入 resolveToConfig: true 以获得 FencedFrameConfig 对象。如果没有设置,则所得的 Promise 将兑现为一个 URN,该 URN 只能在 <iframe> 中使用。

规范

Specification
Fenced Frame
# htmlfencedframeelement

浏览器兼容性

BCD tables only load in the browser

参见