在create中创建dom操作的方式是什么
时间: 2024-09-22 12:07:34 浏览: 23
在JavaScript中,特别是在DOM (Document Object Model) 操作中,创建新的DOM元素通常有几种方式:
1. **通过HTML字符串**:
```javascript
const newNode = document.createElement('div');
newNode.innerHTML = '这是一个新节点';
document.body.appendChild(newNode);
```
2. **直接使用`document.createElement`方法**:
```javascript
const newNode = document.createElement('p');
newNode.textContent = 'Hello World';
document.body.appendChild(newNode);
```
3. **使用`document.createDocumentFragment`创建碎片集再添加元素**:
如果需要批量创建并插入元素,可以先创建一个文档片段,然后再添加到DOM树中:
```javascript
const fragment = document.createDocumentFragment();
for(let i = 0; i < 5; i++) {
const elem = document.createElement('li');
elem.textContent = `第${i+1}个元素`;
fragment.appendChild(elem);
}
document.body.appendChild(fragment);
```
4. **使用模板字面量和`innerHTML`属性**:
```javascript
const template = `
<div>
Content goes here
</div>
`;
const newNode = new DOMParser().parseFromString(template, "text/html").getElementsByTagName('div')[0];
document.body.appendChild(newNode);
```
以上就是在JavaScript中常见的创建DOM操作方式。