问前端大佬 js 中是 querySelector 用的多还是 getElementById 用的多？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 611 天前的主题，其中的信息可能已经有所发展或是发生改变。

目前正在学习 js...看了两个不同的教程，一个常用的是 querySelector ，一个常用的是 getElementById...
emmm ，所以才有了这么个问题...

常用

emmm

getElementById

queryselector

10 条回复 • 2023-03-09 10:20:15 +08:00

GentleFifth

2023-03-08 22:31:44 +08:00 via Android

querySelector ，现代化

poporange

2023-03-08 22:34:36 +08:00

@GentleFifth 也就是说，getElementById 跟 var 一样，就属于时代的眼泪了，对么？

molvqingtai

2023-03-08 22:36:13 +08:00

getElementByxxx 性能比 querySelector 更高，but 前端不在乎这点性能

ochatokori

2023-03-08 22:36:29 +08:00 via Android

querySelector 一个 api 就可以同时用 id 选择器类选择器名称选择器，肯定用 querySelector 啊

poporange

2023-03-08 22:37:09 +08:00

@molvqingtai 所以现在主流就是用 querySelector ，对吧

poporange

2023-03-08 22:37:32 +08:00

@ochatokori 了解，感谢

lambdaq

2023-03-08 22:37:43 +08:00

要什么 getElementById 啊。id 本来就是全局变量。

dcsuibian

2023-03-08 22:49:07 +08:00

这是两个方法，就是两个工具。各自有自己适合的场景，真要说得话都挺常用的，这个比较毫无意义。

有 id 的元素肯定用 getElementById ，虽然 querySelector('#id')也行，但明显没有前者可读性好，性能也差，如果 id 是变量的话，后者还要拼接字符串。我的印象中 ECharts 和 React 的教程中就有使用。

至于 querySelector 嘛，还有 querySelectorAll 。我的印象中好像之前写爬虫的时候用过。

有了虚拟 DOM ，这俩都不常用了。

Al0rid4l

2023-03-09 07:41:29 +08:00

对于 id 就 byId, 对于更复杂的查询就 selector, byId 性能好点. 但是对于 class 就看情况了, selectorAll 是快照, byClassName 是实时的, 单次调用 by 快一些, 但是 by 的返回值不是数组, 缺少一些数组方法可能用起来比较不便, 而且遍历时修改 DOM 会实时反映到 length 容易出 bug, 但是如果复杂的查询, 连续调用 by 会比 selector 快不少, 都会用得到

qzsi001

2023-03-09 10:20:15 +08:00

这两个都是 dom 时代的工具，对于现代框架来说已经被封装了，大部分情况下是不需要用的