HTML DOM Object用法及代碼示例

Object對象僅表示HTML <object>元素。我們可以使用getElementById()訪問任何<object>元素；還可以使用createElement()創建對象元素；方法。

用法:

用於訪問Object元件
```
document.getElementById("id"); 
```
它用於創建目的元件
```
document.createElement("object");
```

屬性值：

屬性	描述
align	用於設置或返回對象的對齊方式
archive	它用於設置或返回一個字符串，這對於實現歸檔函數很有用
border	用於設置或返回對象周圍的邊框
code	它用於設置或返回已編譯的Java類文件的src url。
codeBase	用於設置或返回組件的URL
data	用於設置或返回資源的URL
form	用於返回父表單的參考
height	用於設置或返回對象的高度
hspace	設置或返回水平邊距
name	設置或返回對象的名稱
standby	它用於在加載對象時設置或返回消息
type	用於設置或返回下載數據的內容類型
useMap	用於設置或返回客戶端圖像圖的名稱
vspace	設置或返回垂直邊距
width	用於設置或返回對象的寬度

示例1：訪問對象元素並返回資源的URL

<!DOCTYPE html> 
<html> 
  
<body> 
    <center> 
        <object id="myobject"
                width="400" 
data="https://media.geeksforgeeks.org/wp-content/uploads/geek-8.png"> 
        </object> 
  
        <p>Click the button to get  
          the URL of the embedded file.</p> 
  
        <button onclick="Geeks()"> 
          Click it 
        </button> 
  
        <p id="gfg"></p> 
    </center> 
    <script> 
        function Geeks() { 
            
            // Accessing Object element. 
            var x =  
                document.getElementById( 
                  "myobject").data; 
            
            document.getElementById( 
              "gfg").innerHTML = x; 
        } 
    </script> 
  
</body> 
  
</html>

輸出：

在單擊按鈕之前：
單擊按鈕後：

示例-2：使用document.createElement創建對象元素。

<!DOCTYPE html> 
<html> 
  
<body> 
    <center> 
  
        <p>Click the button to create an  
          Object element with an embedded file.</p> 
  
        <button onclick="Geeks()"> 
          Click it 
        </button> 
  
        <p id="gfg"></p> 
  
        <script> 
            function Geeks() { 
                
                // Creating object element. 
                var x = 
                    document.createElement( 
                      "OBJECT"); 
                
                // Set data of the OBJECT. 
                x.setAttribute("data",  
"https://media.geeksforgeeks.org/wp-content/uploads/geek-8.png"); 
                
                x.setAttribute("width", "400"); 
                x.setAttribute("height", "100"); 
                document.body.appendChild(x); 
            } 
        </script> 
    </center> 
</body> 
  
</html>

輸出：

在單擊按鈕之前：
單擊按鈕後：

支持的瀏覽器：

穀歌瀏覽器
火狐瀏覽器
Edge
Safari
Opera

相關用法

注：本文由純淨天空篩選整理自Sabya_Samadder大神的英文原創作品 HTML | DOM Object Object。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。