🌻JavaScript DOM

type
status
date
slug
summary
tags
category
icon
password
☀️
待补充
DOM（Document Object Model）是将整个 HTML 文档的每一个标签元素视为一个对象，这个对象下包含了许多的属性和方法，通过操作这些属性或者调用这些方法实现对 HTML 的动态更新，为实现网页特效以及用户交互提供技术支撑。
简言之 DOM 是用来动态修改 HTML 的，其目的是开发网页特效及用户交互。

DOM 树

notion image

document

document 是 JavaScript 内置的专门用于 DOM 的对象，该对象包含了若干的属性和方法。

获取 DOM

任意 DOM 对象都包含 nodeType 属性，用来检检测节点类型
  • querySelector 满足条件的第一个元素
  • querySelectorAll 满足条件的元素集合 返回伪数组
  • getElementById 专门获取元素类型节点，根据标签的 id 属性查找
  • getElementsByTagName

操作 DOM

元素内容

  • innerText 将文本内容添加/更新到任意标签位置，文本中包含的标签不会被解析。
  • innerHTML 将文本内容添加/更新到任意标签位置，文本中包含的标签会被解析。
  • 如果文本内容中包含 html 标签时推荐使用 innerHTML，否则建议使用 innerText 属性。

元素属性

 
 

事件

🌻
欢迎在下方留言讨论~
JavaScript 函数与对象JavaScript BOM
Loading...
目录