js如何操作html

JavaScript 中操作 html 元素的方法包括：获取元素：getelementbyid()、getelementsbytagname()、getelementsbyclassname()、queryselector()、queryselectorall()创建元素：createelement()、createtextnode()、appendchild()修改元素：innerhtml、innertext、style、attributes删除元素：removechild()

JavaScript 操作 HTML

一、如何获取 HTML 元素

• getElementById()：根据元素的 id 获取元素。
• getElementsByTagName()：根据元素的标签名获取元素集合。
• getElementsByclassName()：根据元素的 class 名称获取元素集合。
• querySelector()：使用 css 选择器获取单个元素。
• querySelectorAll()：使用 CSS 选择器获取元素集合。

二、如何创建 HTML 元素

• createElement()：创建新元素。
• createTextNode()：创建文本节点。
• appendChild()：将元素添加到父元素中。

三、如何修改 HTML 元素

立即学习“前端免费学习笔记（深入）”；

• innerHTML：设置或获取元素的 HTML 内容。
• innerText：设置或获取元素的文本内容。
• style：设置或获取元素的样式。
• attributes：获取或设置元素的属性。

四、如何删除 HTML 元素

• removeChild()：从父元素中删除元素。

五、示例

获取元素：

const element = document.getElementById('my-element');

创建元素：

const newElement = document.createElement('p'); newElement.appendChild(document.createTextNode('Hello World!'));

修改元素：

element.innerHTML = 'New Content'; element.style.color = 'red';

删除元素：

element.parentNode.removeChild(element);