什么是 DOM?

本贴最后更新于 1916 天前,其中的信息可能已经斗转星移

2018-12-19

回答

DOM(文档对象模型)是可扩展标记语言的标准编程接口,用来处理如 HTML 或 XML 这样由节点组成的树形结构的标记语言。这些节点(例如元素和文本节点)都是能够被编程接口操作的对象,他们任何可见的改变都会在文档中实时反映出来。在浏览器中,这些接口可供 JavaScript 进行使用,使其操作 DOM 节点来改变他们的样式、内容、在文档中的位置或者通过事件监听器来进行交互。

加分回答

  • DOM 的设计与特定的编程语言相独立,以便使文档的结构化表述可以通过单一、一致的 API 获得。
  • 随着页面的加载,DOM 在浏览器中是逐步构建的,因此脚本通常放在页面底部,或设置 defer 属性后置于 <head> 中,或放在 DOMContentLoaded 事件监听器内部。为了避免错误,脚本对 DOM 节点的操作应该放在 DOM 完成构建之后。
  • document.getElementById()document.querySelector() 是用来选择 DOM 节点的常用方法。
  • innerHTML 属性赋值为一个新的 HTML 可解析的字符串时,可以方便快捷高效的将一个动态 HTML 内容添加到节点对象上。如
document.querySelector('section').innerHTML = `<h1>30 Seconds</h1><div>${content}</div><footer>by Vanessa</footer>`
  • BOM 主要处理浏览器窗口和框架,不过通常浏览器特定的 JavaScript 扩展都被看做 BOM 的一部分。window 对象的属性和方法通常被称为 BOMDOM 描述了处理网页内容的方法和接口,BOM 描述了与浏览器进行交互的方法和接口。

返回总目录

每天 30 秒

  • 30Seconds

    📙 前端知识精选集,包含 HTML、CSS、JavaScript、React、Node、安全等方面,每天仅需 30 秒。

    • 精选常见面试题,帮助您准备下一次面试
    • 精选常见交互,帮助您拥有简洁酷炫的站点
    • 精选有用的 React 片段,帮助你获取最佳实践
    • 精选常见代码集,帮助您提高打码效率
    • 整理前端界的最新资讯,邀您一同探索新世界
    488 引用 • 383 回帖 • 10 关注
  • HTML

    HTML5 是 HTML 下一个的主要修订版本,现在仍处于发展阶段。广义论及 HTML5 时,实际指的是包括 HTML、CSS 和 JavaScript 在内的一套技术组合。

    103 引用 • 294 回帖
  • 面试

    面试造航母,上班拧螺丝。多面试,少加班。

    324 引用 • 1395 回帖 • 1 关注

相关帖子

5 回帖

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
Vanessa
我们终此一生,就是要摆脱他人的期待,找到真正的自己。 昆明