数据结构
网络
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 浏览
广告