当前位置: 首页>> 代码示例 >> 用法及示例精选 >>正文

HTML IFrame src用法及代码示例

HTML DOM IFrame的src属性用于设置或返回<iframe>元素的src属性的值。此属性用于指定嵌入到iframe元素的文档的URL。

用法:

它返回src属性。
```
iframeObject.src
```
它用于设置src属性。
```
iframeObject.src = URL 
```

属性值：
它包含一个单值URL，该URL指定嵌入到iframe中的文档的URL。下面列出了两种类型的URL链接：

Absolute URL:它指向另一个网页。
Relative URL:它指向同一网页上的其他文件。

返回值：它返回一个字符串值，该字符串值表示嵌入Iframe元素中的文档的URL。

范例1：本示例说明了如何重播Iframe src属性。

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM iframe src Property 
    </title> 
</head> 
  
<body style="text-align:center;"> 
  
    <h1>GeeksforGeeks</h1> 
  
    <h2> 
      HTML DOM iframe src Property 
  </h2> 
  
    <iframe src= 
"https://ide.geeksforgeeks.org/index.php"
            id="GFG" 
            height="200"
            width="400"> 
  </iframe> 
    <br> 
    <br> 
    <button onclick="Geeks()">Submit</button> 
    <p id="sudo"></p> 
    <script> 
        function Geeks() { 
            var x = document.getElementById("GFG").src; 
            document.getElementById("sudo").innerHTML = x; 
  
        } 
    </script> 
  
</body> 
  
</html>

输出：
在单击按钮之前：

单击按钮后：

范例2：本示例说明了如何设置Iframe src属性。

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
        HTML DOM iframe src Property 
    </title> 
</head> 
  
<body style="text-align:center;"> 
  
    <h1>GeeksforGeeks</h1> 
  
    <h2> 
      HTML DOM iframe src Property 
  </h2> 
  
    <iframe src= 
"https://ide.geeksforgeeks.org/index.php"
            id="GFG" 
            height="200"
            width="400"> 
  </iframe> 
    <br> 
    <br> 
    <button onclick="Geeks()">Submit</button> 
    <p id="sudo"></p> 
    <script> 
        function Geeks() { 
            var x =  
                document.getElementById("GFG").src = 
                "https://www.wikipedia.org/"; 
  
        } 
    </script> 
  
</body> 
  
</html>

输出：
在单击按钮之前：

单击按钮后：