DOM面试题及详细答案.docxVIP

DOM面试题及详细答案

一、基础认知类（必问，考察基础掌握程度）

1.什么是DOM？它和HTML、CSS的关系是什么？

答案：DOM（DocumentObjectModel，文档对象模型）是浏览器将HTML文档解析后，生成的一个树形结构（文档树），每个HTML标签、文本、属性都对应树中的一个节点（元素节点、文本节点、属性节点等）。我们通过DOM提供的API，就能操作页面中的元素（比如修改内容、修改样式、添加/删除元素）。

和HTML、CSS的关系：HTML是页面的结构基础（静态的），CSS负责页面样式，而DOM是连接HTML和JavaScript的桥梁——JavaScript不能直接操作HTML，只能通过操作DOM节点，间接修改页面的结构和样式。简单说：HTML定义“有什么”，CSS定义“长什么样”，DOM让“它能被JS操控”。

2.DOM节点有哪些类型？请举例说明。

答案：常见的DOM节点类型有5种，重点记前3种：

元素节点（ElementNode）：最常用，对应HTML标签，比如div、p、img，nodeType值为1；

文本节点（TextNode）：标签内的文本内容，比如phello/p中的“hello”，nodeType值为3；

属性节点（AttributeNode）：标签的属性，比如imgsrc=xxx中的src属性，nodeType值为2；

文档节点