JS HTML DOM记录1

JS HTML DOM:

Document Object Model 文件对象模型

1、  JavaScript HTML DOM 文档:

(1)       查找HTML元素:

方法

描述

document.getElementById(id)

通过元素 id 来查找元素

document.getElementsByTagName(name)

通过标签名来查找元素

document.getElementsByClassName(name)

通过类名来查找元素

(2)改变HTML元素

方法

描述

element.innerHTML = new html content

改变元素的 inner HTML

element.attribute = new value

改变 HTML 元素的属性值

element.setAttribute(attributevalue)

改变 HTML 元素的属性值

element.style.property = new style

改变 HTML 元素的样式

(3)添加和删除元素

方法

描述

document.createElement(element)

创建 HTML 元素

document.removeChild(element)

删除 HTML 元素

document.appendChild(element)

添加 HTML 元素

document.replaceChild(element)

替换 HTML 元素

document.write(text)

写入 HTML 输出流

(4)添加事件处理程序

方法

描述

document.getElementById(id).onclick = function(){code}

向 onclick 事件添加事件处理程序

(5)查找HTML对象

……

https://www.w3school.com.cn/js/js_htmldom_document.asp  JavaScript HTML DOM文档

2、  JavaScript HTML DOM 改变CSS

document.getElementById(id).style.property = new style

3、  JavaScript HTML DOM事件

4、  JavaScript HTML DOM事件监听器

   addEventListener() 方法

当用户点击按钮时触发事件监听器:
document.getElementById("myBtn").addEventListener("click", displayDate);

5、  Javascript HTML DOM 导航

6、  节点

添加、删除、替换节点

相关推荐