poporange
V2EX  ›  问与答

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

  •  
  •   poporange · Mar 8, 2023 · 1689 views
    This topic created in 1171 days ago, the information mentioned may be changed or developed.
    目前正在学习 js...看了两个不同的教程,一个常用的是 querySelector ,一个常用的是 getElementById...
    emmm ,所以才有了这么个问题...
    10 replies    2023-03-09 10:20:15 +08:00
    GentleFifth
        1
    GentleFifth  
       Mar 8, 2023 via Android
    querySelector ,现代化
    poporange
        2
    poporange  
    OP
       Mar 8, 2023
    @GentleFifth 也就是说,getElementById 跟 var 一样,就属于时代的眼泪了,对么?
    molvqingtai
        3
    molvqingtai  
       Mar 8, 2023
    getElementByxxx 性能比 querySelector 更高,but 前端不在乎这点性能
    ochatokori
        4
    ochatokori  
       Mar 8, 2023 via Android
    querySelector 一个 api 就可以同时用 id 选择器类选择器名称选择器,肯定用 querySelector 啊
    poporange
        5
    poporange  
    OP
       Mar 8, 2023
    @molvqingtai 所以现在主流就是用 querySelector ,对吧
    poporange
        6
    poporange  
    OP
       Mar 8, 2023
    @ochatokori 了解,感谢
    tf2
        7
    tf2  
       Mar 8, 2023
    要什么 getElementById 啊。id 本来就是全局变量。
    dcsuibian
        8
    dcsuibian  
       Mar 8, 2023
    这是两个方法,就是两个工具。各自有自己适合的场景,真要说得话都挺常用的,这个比较毫无意义。

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

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


    有了虚拟 DOM ,这俩都不常用了。
    Al0rid4l
        9
    Al0rid4l  
       Mar 9, 2023
    对于 id 就 byId, 对于更复杂的查询就 selector, byId 性能好点. 但是对于 class 就看情况了, selectorAll 是快照, byClassName 是实时的, 单次调用 by 快一些, 但是 by 的返回值不是数组, 缺少一些数组方法可能用起来比较不便, 而且遍历时修改 DOM 会实时反映到 length 容易出 bug, 但是如果复杂的查询, 连续调用 by 会比 selector 快不少, 都会用得到
    qzsi001
        10
    qzsi001  
       Mar 9, 2023
    这两个都是 dom 时代的工具,对于现代框架来说已经被封装了,大部分情况下是不需要用的
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2906 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 94ms · UTC 14:03 · PVG 22:03 · LAX 07:03 · JFK 10:03
    ♥ Do have faith in what you're doing.