在html文档中声明Javascript。我们有3种方法可以做到这一点
考虑哪一项在性能方面更快更有效?
谢谢
答案 0 :(得分:5)
如果可能的话,将javascripts / references添加到页面底部的链接脚本中。正如这里建议的那样:http://developer.yahoo.com/performance/rules.html
答案 1 :(得分:2)
这实际上取决于您编写的JavaScript类型。如果编写需要在正文中执行的代码(例如:document.write()),则必须在body标记中编写代码。如果不是这种情况,并且如果您正在编写javascript函数,则应该在head标记或其他文件中。如果要在多个页面中使用相同的功能,则可以使用其他文件。
w.r.t表现,它又取决于你在做什么。如果您只有一个页面使用javascript,那么将其保留在标题中会更快。这样你就可以减少往返以获取javascript文件。
如果您有多个页面使用相同的功能,那么如果这些功能位于不同的文件中会更快,因为它们会被下载一次并多次使用。
答案 2 :(得分:2)
1和2是关于标签位置。 3适用于1和2.
此外,您可以在事件处理程序属性中使用javascript,如下所示:
<button onclick="alert(1)">pressme</button>
最重要的是,您还可以使用javascript作为网址,例如链接:
<a href="javascript: alert(1)">click me</a>
坚持您的示例:首先,使用在标记中加载src组件的外部脚本文件通常是个好主意。这允许浏览器缓存脚本,这允许页面在初始页面加载后加载更快。如果您使用jQuery之类的东西并从公共Conent传送网络加载它们(例如google ajax api,请参阅:http://code.google.com/apis/ajaxlibs/documentation/)
关于位置(头部或身体):在过去,人们常说,将脚本放在头部以确保一旦装入主体就加载它们并且用户可以使用所有交互式元素。但问题是加载那些脚本会阻止加载页面的可视部分,即正文。基本上,用户正在查看一个空白页面,想知道他们的页面花了很长时间才能呈现。 所以现在,流行的智慧是尽可能地将所有脚本放在体内,并确保以能够处理部分加载脚本的方式编写javascript。 YSlow指南是了解这些内容的绝佳资源。看到: http://developer.yahoo.com/yslow/help/
答案 3 :(得分:1)
我说这取决于具体情况。
如果您有一个跨站点使用的大型脚本并且想要利用客户端缓存机制,那么外部文件是个好主意。
如果脚本仅在一个页面上使用,那么将其保留在头部/主体中可能有意义。很明显,脚本越早出现在页面中,JavaScript就越早被执行,但是你可能会因为等待DOM可用于脚本而受到约束,在这种情况下,如果它在头部,它将不会有任何区别或身体。
您可以在任何定义需要访问的DOM的HTML之后立即放置脚本。这可能是获取脚本在页面中执行的最快方法,但如果它很大或在许多地方使用,则不要通过外部加载(和缓存)文件来实现。
答案 4 :(得分:0)
如果你非常关心性能,我会说在html中加载js会是最快的。在页面其余部分之前加载的项目,因此从用户的角度来看,他们可能认为下载需要更长的时间,因为页面在加载之后才会开始渲染,但数据量应该相同。外部js文件可能是最慢的,因为它需要单独的http请求。
答案 5 :(得分:0)
简短的回答是......好吧......这取决于。
如果通过
在性能方面更快更有效率
你的意思是“加载速度更快”,然后头部的内联脚本会在第一次加载时更快地将代码放入浏览器中。可以缓存外部文件,因此如果您在多个页面中包含相同的脚本,一旦您克服了第一次加载它的开销,那么您将它驻留在内存中。
答案 6 :(得分:0)
我宁愿将我的Javascript和HTML都放在同一个文件中,只是因为我不喜欢打开许多不同的选项卡。但是再一次,在不同文件中同时使用Javascript,HTML和CSS变得非常整洁。
到目前为止,代码越复杂/越长,我将使用不同的文件,但是如果代码简单,我将对所有内容使用相同的文件。