V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
poporange
V2EX  ›  问与答

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

  •  
  •   poporange · 2023-03-08 22:27:19 +08:00 · 1186 次点击
    这是一个创建于 624 天前的主题,其中的信息可能已经有所发展或是发生改变。
    目前正在学习 js...看了两个不同的教程,一个常用的是 querySelector ,一个常用的是 getElementById...
    emmm ,所以才有了这么个问题...
    10 条回复    2023-03-09 10:20:15 +08:00
    GentleFifth
        1
    GentleFifth  
       2023-03-08 22:31:44 +08:00 via Android
    querySelector ,现代化
    poporange
        2
    poporange  
    OP
       2023-03-08 22:34:36 +08:00
    @GentleFifth 也就是说,getElementById 跟 var 一样,就属于时代的眼泪了,对么?
    molvqingtai
        3
    molvqingtai  
       2023-03-08 22:36:13 +08:00
    getElementByxxx 性能比 querySelector 更高,but 前端不在乎这点性能
    ochatokori
        4
    ochatokori  
       2023-03-08 22:36:29 +08:00 via Android
    querySelector 一个 api 就可以同时用 id 选择器类选择器名称选择器,肯定用 querySelector 啊
    poporange
        5
    poporange  
    OP
       2023-03-08 22:37:09 +08:00
    @molvqingtai 所以现在主流就是用 querySelector ,对吧
    poporange
        6
    poporange  
    OP
       2023-03-08 22:37:32 +08:00
    @ochatokori 了解,感谢
    lambdaq
        7
    lambdaq  
       2023-03-08 22:37:43 +08:00
    要什么 getElementById 啊。id 本来就是全局变量。
    dcsuibian
        8
    dcsuibian  
       2023-03-08 22:49:07 +08:00
    这是两个方法,就是两个工具。各自有自己适合的场景,真要说得话都挺常用的,这个比较毫无意义。

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

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


    有了虚拟 DOM ,这俩都不常用了。
    Al0rid4l
        9
    Al0rid4l  
       2023-03-09 07:41:29 +08:00
    对于 id 就 byId, 对于更复杂的查询就 selector, byId 性能好点. 但是对于 class 就看情况了, selectorAll 是快照, byClassName 是实时的, 单次调用 by 快一些, 但是 by 的返回值不是数组, 缺少一些数组方法可能用起来比较不便, 而且遍历时修改 DOM 会实时反映到 length 容易出 bug, 但是如果复杂的查询, 连续调用 by 会比 selector 快不少, 都会用得到
    qzsi001
        10
    qzsi001  
       2023-03-09 10:20:15 +08:00
    这两个都是 dom 时代的工具,对于现代框架来说已经被封装了,大部分情况下是不需要用的
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3842 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 05:17 · PVG 13:17 · LAX 21:17 · JFK 00:17
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.