📜  js 创建 div - Javascript (1)

📅  最后修改于: 2023-12-03 15:17:01.158000             🧑  作者: Mango

JS创建div - Javascript

在Javascript中创建<div>元素可以通过DOM操作来实现。DOM是文档对象模型的缩写,它是一种API,允许我们访问文档的内容并对其进行修改。 下面是一些使用Javascript创建<div>元素的方法。

1.使用createElement()方法创建div

createElement()方法可用于在DOM中创建新元素,包括<div>标记。

//创建一个新的div元素
const newDiv = document.createElement('div');

//添加一些文本内容
newDiv.innerHTML = '这是新创建的div元素';

//将新创建的div元素添加到页面中
document.body.appendChild(newDiv);
2. 使用innerHTML属性创建div

在Javascript中使用innerHTML属性可以轻松创建和修改元素的内容。下面是创建<div>元素的例子。

//在页面中创建新的div元素
document.body.innerHTML += '<div>这是通过innerHTML创建的新div元素</div>';
3. 使用insertAdjacentHTML()方法创建div

insertAdjacentHTML()方法可以用于向文档中插入HTML代码。创建<div>标记时,可以使用该方法将其插入到指定的位置。

//创建一个新的div元素
let newDiv = '<div>这是通过insertAdjacentHTML方法创建的新div元素</div>';

//通过insertAdjacentHTML方法将新div元素插入到body标记的最后面
document.body.insertAdjacentHTML('beforeend', newDiv);

以上是在Javascript中创建<div>元素的几种方法,可以根据需要选择不同的方法实现。