資料結構
網路
RDBMS
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時裝學
法律學HTML DOM div 物件
HTML DOM div 物件與 HTML <div> 元素相關聯。div 是一個通用塊級元素，允許我們對元素進行分組，以便對其應用樣式或操縱單個標籤名或 id 下的一組 HTML 元素。
屬性
以下是 div 物件的屬性 −
| 屬性 | 描述 |
|---|---|
| 對齊 | 設定或返回 <div> 元素的 align 屬性值。HTML5 中不支援此屬性，請改用 css 進行對齊。 |
語法
以下是語法 −
建立 div 物件 −
var p = document.createElement("DIV");示例
讓我們看一個 HTML DOM div 物件的示例 −
<!DOCTYPE html>
<html>
<body>
<h2>Div object example</h2>
<p>click on the CREATE button to create a div element with some text in it.</p>
<button onclick="createDiv()">CREATE</button>
<script>
function createDiv() {
var d = document.createElement("DIV");
var txt = document.createTextNode("Sample Div element");
d.setAttribute("style", "margin:10px;width:200px;background-color: lightgreen;border:2px solid blue");
d.appendChild(txt);
document.body.appendChild(d);
}
</script>
</body>
</html>輸出
這將生成以下輸出 −
點選 CREATE 按鈕 −
在上面的示例中 −
我們首先建立一個按鈕 CREATE，使用者點選後將執行 createDiv() 方法 −
<button onclick="createDiv()">CREATE</button>
createDiv() 函式建立一個 <div> 元素，並將其賦值給變數 d。然後建立一個文字節點，並將其賦值給變數 txt。接著使用 setAttribute() 方法設定 <div> 元素屬性。然後使用 appendChild() 方法將文字節點附加到 <div> 元素。<div> 元素以及文字節點隨後作為文件正文的子元素附加 −
function createDiv() {
var d = document.createElement("DIV");
var txt = document.createTextNode("Sample Div element");
d.setAttribute("style", "margin:10px;width:200px;background-color: lightgreen;border:2px solid blue");
d.appendChild(txt);
document.body.appendChild(d);
}
更新於:2021-2-20
455 瀏覽
廣告