HTML DOM iFrame 对象

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

现在让我们创建一个 iframe 对象 −

语法

以下是语法：

document.createElement(“IFRAME”);

属性

以下是 iframe 对象的属性 −

属性	说明
contentDocument	它返回由 iframe HTML 元素生成的文档对象。
contentWindow	它返回由 iframe HTML 元素生成的窗口对象。
height	它返回和修改 iframe HTML 元素的 height 属性的值。
name	它返回和修改 iframe HTML 元素的 name 属性的值。
sandbox	它返回和修改 iframe HTML 元素的 sandbox 属性的值。
seamless	它返回和修改 iframe 是否应看起来像 Seamless，如网页的一部分，即没有边框和没有滚动条。
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>