全部学科
Python全栈
python
NodeJS全栈
nodejs

DOM基础与浏览器API专题测试

20 题 45 分钟 难度:★★

考察知识点

  • 事件处理与事件流:DOM事件流、事件捕获与冒泡、事件委托
  • DOM遍历与选择器:元素选择、NodeList与HTMLCollection、遍历方法
  • CSS样式操作与类管理:style属性、classList、getComputedStyle
  • DOM树与节点操作:节点创建、添加、移除、复制操作
  • 浏览器BOM与窗口对象:window对象、screen对象、尺寸获取
  • 网络请求与Fetch API:fetch配置、请求方法、响应处理
  • 定时器与动画帧:setTimeout/setInterval、requestAnimationFrame
💡 参考答案在文末
判断题
1

判断:事件冒泡是指事件从目标元素开始,逐级向上传播到父元素的过程。

A

B

2

判断:innerHTML会解析HTML字符串并创建对应的DOM节点,textContent只设置纯文本不解析HTML。

A

B

3

判断:appendChild方法将节点添加到父元素的子节点列表末尾。

A

B

4

判断:fetch API相比XMLHttpRequest的优势包括:基于Promise、语法更简洁、默认不携带Cookie到跨域请求。

A

B

5

判断:Cookie数据会在每次HTTP请求时自动发送到服务器。

A

B

单选题
6

setTimeout(fn, 1000)表示什么意思?

A

每隔1秒重复执行fn

B

延迟1秒后执行一次fn

C

立即执行fn,持续1秒

D

1秒后停止执行fn

7

事件委托(Event Delegation)的核心原理是什么?

A

在每个子元素上绑定事件

B

利用事件冒泡,在父元素上统一处理子元素事件

C

利用事件捕获,阻止事件到达子元素

D

创建自定义事件并手动触发

8

DocumentFragment的作用是什么?

A

创建一个虚拟DOM用于渲染优化

B

作为轻量级容器批量添加节点,减少DOM操作次数

C

存储文档的备份副本

D

创建跨文档的节点引用

9

DOM事件流的正确顺序是什么?

A

事件冒泡 → 目标阶段 → 事件捕获

B

事件捕获 → 目标阶段 → 事件冒泡

C

目标阶段 → 事件捕获 → 事件冒泡

D

事件捕获 → 事件冒泡 → 目标阶段

10

localStorage和sessionStorage的典型存储容量限制是多少?

A

4KB

B

1MB

C

5MB

D

100MB

11

element.style.backgroundColor = 'red'设置的是什么类型的样式?

A

内部样式表中的样式

B

外部CSS文件中的样式

C

元素的内联样式

D

计算后的最终样式

12

classList.add()方法的作用是什么?

A

移除元素的类名

B

为元素添加类名

C

切换元素的类名

D

检查元素是否有某个类名

13

requestAnimationFrame相比setTimeout/setInterval用于动画的优势是什么?

A

执行频率更高,动画更流畅

B

自动与浏览器刷新率同步,避免丢帧

C

不占用主线程,性能更好

D

可以精确控制执行时间

多选题
14

以下哪些是事件对象(Event)的常用方法或属性?

A

e.target - 触发事件的元素

B

e.currentTarget - 绑定事件的元素

C

e.stopPropagation() - 阻止事件冒泡

D

e.preventDefault() - 阻止默认行为

E

e.stopDefault() - 阻止默认行为

15

classList对象提供以下哪些方法?

A

add() - 添加类名

B

remove() - 移除类名

C

toggle() - 切换类名

D

contains() - 检查类名是否存在

E

append() -追加类名

16

fetch可以发送以下哪些HTTP请求方法?

A

GET - 获取资源

B

POST - 创建资源

C

PUT - 更新资源

D

DELETE - 删除资源

E

CONNECT - 建立隧道连接

17

requestAnimationFrame有哪些优势?

A

与浏览器刷新率同步,避免丢帧

B

页面不可见时自动暂停,节省资源

C

提供高精度时间戳参数

D

不需要手动清除,自动管理

E

执行频率固定为60fps

18

以下哪些是DOM节点类型?

A

元素节点(Element)

B

文本节点(Text)

C

注释节点(Comment)

D

样式节点(Style)

E

文档节点(Document)

填空题
19

操作DOM样式时,____________属性用于设置内联样式,____________对象用于管理类名,____________方法用于获取元素最终计算样式。

20

DOM节点操作中,____________创建元素节点,____________将节点添加到末尾,____________移除子节点,cloneNode复制节点。

参考答案
1.正确 2.正确 3.正确 4.正确 5.正确 6.B 7.B 8.B 9.B 10.C 11.C 12.B 13.B 14.A;B;C;D 15.A;B;C;D 16.A;B;C;D 17.A;B;C 18.A;B;C;E 19.style;classList;getComputedStyle 20.createElement;appendChild;removeChild
想在手机上练习这套试卷?
使用微信卷王开发者小程序,打开首页顶部扫码功能识别二维码
下一套试卷 → HTMLSEO基础专题测试
扫码体验小程序
加载中
想在手机上刷题学习?
使用微信卷王开发者小程序,打开首页顶部扫码功能识别二维码