HTML DOM iFrame用法及代码示例

HTML DOM iframe 对象表示 HTML 文档的 <iframe> 元素。

现在让我们创建 iframe 对象 -

用法

以下是语法 -

document.createElement(“IFRAME”);

特性

以下是 iframe 对象的属性 -

属性	解释
contentDocument	它返回由 iframe HTML 元素生成的文档对象。
contentWindow	它返回由 iframe HTML 元素生成的 window 对象。
height	它返回并修改 iframe HTML 元素的 height 属性的值。
name	它返回并修改 iframe HTML 元素的 name 属性的值。
sandbox	它返回并更改 iframe HTML 元素的 sandbox 属性值。
seamless	它返回并修改 iframe 是否应该看起来无缝，就像它是网页的一部分，即没有边框和滚动条。
src	它返回并修改 iframe HTML 元素的 src 属性的值。
srcdoc	它返回并修改 iframe HTML 元素的 srcdoc 属性的值。
width	它返回并更改 iframe HTML 元素的 width 属性值。

示例

让我们看一个 DOM iframe 对象的例子 -

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      text-align:center;
   }
   .btn{
      background-color:lightblue;
      border:none;
      height:2rem;
      border-radius:50px;
      width:60%;
      margin:1rem auto;
   }
</style>
</head>
<body>
<h1>DOM IFrame Object Example</h1>
<button onclick="createIframe()" class="btn">Click me to create an iframe</button>
<script>
   function createIframe() {
      var x = document.createElement("IFRAME");
      x.setAttribute("src", "https://tutorialspoint.com/");
      document.body.appendChild(x);
   }
</script>
</body>
</html>

输出

这将产生以下输出 -

点击 ”Click me to create an iframe”按钮来创建一个 iframe -

相关用法

注：本文由纯净天空筛选整理自Sharon Christine大神的英文原创作品 HTML DOM iFrame Object。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。