V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
PageSpeed 相关文档
为 NGINX 编译 PageSpeed 支持
ngx_pagespeed
Configuring mod_pagespeed Filters
加载性能测试工具
WebPagetest
Gomez
xifangczy
V2EX  ›  前端优化

非必须放在 head 的 JS 到底放在什么位置好?

  •  
  •   xifangczy · 2015-06-11 17:44:36 +08:00 · 3472 次点击
    这是一个创建于 3213 天前的主题,其中的信息可能已经有所发展或是发生改变。

    帮朋友做几个页面,找了个切图的人,说JS应该放底部。我一直习惯放在上面差不多<body>位置,现在浏览器还存在JS放不同位置效率不同的情况吗?

    11 条回复    2015-06-11 21:40:39 +08:00
    b821025551b
        1
    b821025551b  
       2015-06-11 17:46:25 +08:00
    最好放底部,毕竟不是所有人都用100M的wifi
    ALeo
        2
    ALeo  
       2015-06-11 17:46:45 +08:00
    有的时候不是效率问题,而是你的js里出错的话,会导致整个页面的js全奔溃,然后你的页面就乱了。。
    zythum
        3
    zythum  
       2015-06-11 18:56:49 +08:00   ❤️ 1
    有。js inline的话是页面同步加载的。 这个script没有执行完下面的html是不会渲染的。会降低页面渲染完成时间。
    abelyao
        4
    abelyao  
       2015-06-11 18:57:18 +08:00
    body 结束前,最后一个页面元素之后
    blacktulip
        5
    blacktulip  
       2015-06-11 19:07:07 +08:00
    我习惯紧挨 </body> 上面
    lincanbin
        6
    lincanbin  
       2015-06-11 19:21:54 +08:00
    建议不要在HTML里加载,直接用一个JavaScript文件异步加载其他所有JavaScript文件。
    lujjjh
        7
    lujjjh  
       2015-06-11 19:31:07 +08:00 via Android
    这种差异不是靠现代浏览器可以解决的。JS 里可以改变 HTML 结构,所以不执行完整个 JS 文件浏览器是不敢继续渲染下去的,除非你告诉浏览器某个脚本可以延期执行,也就是 <script> 的 defer 属性了。
    shierji
        8
    shierji  
       2015-06-11 19:48:58 +08:00
    貌似现在国际惯例是放底部
    xifangczy
        9
    xifangczy  
    OP
       2015-06-11 19:50:32 +08:00
    原来如此...我想的是反正head里也有 其他的也都放在上面,这样也方便维护
    lianyue
        10
    lianyue  
       2015-06-11 21:32:33 +08:00
    都放header script 有个异步属性的
    laoyuan
        11
    laoyuan  
       2015-06-11 21:40:39 +08:00   ❤️ 1
    搜索框99.99%的网站都很恶心,你正输入内容的时候,页面刚加载完JS,又给你弄些莫名奇妙的东西。所以搜索框的JS我直接写到HTML里的
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3208 人在线   最高记录 6543   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 14:25 · PVG 22:25 · LAX 07:25 · JFK 10:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.