首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >优点和缺点:将javascript放入头部,并在身体关闭之前放置

优点和缺点:将javascript放入头部,并在身体关闭之前放置
EN

Stack Overflow用户
提问于 2010-03-16 08:32:07
回答 5查看 57.9K关注 0票数 92

大多数javascript和web开发书籍/文章都说你必须把CSS放在页面的头标签里,把javascript放在页面的底部。

但是当我打开像这个这样的著名网站的html源代码时,我发现他们在head标签里放了一些js文件。

这两种方法的优缺点以及何时使用哪种方法?

对于同样的问题,找到了另一个问题: Where should I declare JavaScript files used in my page? In or near ?

EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2010-03-16 08:39:24

来自雅虎的Best Practices for Speeding Up Your Web Site

脚本造成的问题是它们会阻止并行下载。HTTP/1.1规范建议浏览器为每个主机名并行下载不超过两个组件。如果您从多个主机名提供映像,则可以并行进行两个以上的下载。但是,在下载脚本时,浏览器不会启动任何其他下载,即使是在不同的主机名上也是如此。

在某些情况下,将脚本移到底部并不容易。例如,如果脚本使用document.write插入页面内容的一部分,则不能在页面中将其下移。还可能存在作用域问题。在许多情况下,有解决这些情况的方法。

另一个经常出现的建议是使用延迟脚本。DEFER属性指示脚本不包含document.write,并且是浏览器可以继续呈现的线索。不幸的是,Firefox不支持DEFER属性。在Internet Explorer中,脚本可能会延迟,但不会像所需的那样延迟。如果脚本可以延迟,则也可以将其移动到页面底部。这将使您的网页加载速度更快。

因此,一般而言,最好将它们放在底部。然而,这并不总是可能的,而且通常也不会有太大的不同。

票数 65
EN

Stack Overflow用户

发布于 2010-03-16 09:05:25

正如其他人所说,当你将javascript放在头部时,它会延迟页面的渲染,直到脚本加载之后,这意味着页面加载可能需要更长的时间-特别是如果你正在下载大的脚本文件。

如果将脚本标记移动到页面的末尾,将确保浏览器在脚本标记之前下载图像和样式表,并且很可能在脚本开始运行之前呈现页面。这也意味着,如果您依赖于脚本中的某些功能,则在页面对用户可见后一段时间内,这些功能才可用。

如果您正在添加样式或元素(等,使用某种形式的更丰富的编辑器切换文本字段),这将作为闪烁显示给用户。

如果要向元素添加单击事件,则在元素本身可见后一段时间内,才能单击这些事件。

有时这些问题需要你把你的脚本放在头上,其他时候你可以把它们放在底部就行了。

我的意思是(完全反对YSlow和很多聪明人)你应该把你的脚本放在head标签里,大多数时候只依赖它们被缓存。

票数 31
EN

Stack Overflow用户

发布于 2012-11-06 05:49:52

通常,您应该将脚本引用放在页面的底部。脚本不仅需要下载,还必须在块释放和页面继续呈现过程之前进行评估和执行。应该把像现代这样的东西放在最上面,因为它做了一些功能检测,以及你可能想要的HTML5垫片。

您想要将脚本放在页面底部的另一个原因是单点故障或SPOFs。这就是脚本调用超时或由于某些其他原因阻止页面执行的地方。这可能会在第三方广告库等方面发生很多。

是的,你可能不得不更努力地思考如何构建你的应用程序,但我发现对我来说很快就会变得非常自然。在过去的4年里,我用底部的脚本构建了数百个web应用程序,我可以分辨出其中的区别。我可能是500ms,可能是5000ms,但这一切都很重要。

票数 9
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2451417

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档