页面中脚本标记的位置如何影响其中定义的JavaScript函数?

Mar*_*ers 43 html javascript tags function

我读了你应该在定义JavaScript函数<head>的标签,但如何做的位置<script>(是否在<head>,<body>或任何其他标记)影响的JavaScript函数.

具体来说,它如何影响函数的范围以及从何处调用它?

Sim*_*ver 26

告诉人们<SCRIPT>只在头部添加听起来像是一件合理的事情,但正如其他人所说,有很多原因导致不推荐甚至不实用 - 主要是速度和动态生成HTML页面的方式.

这就是HTML 4规范所说的:

SCRIPT元素将脚本放在文档中.此元素可能在HTML文档的HEAD或BODY中出现任意次.

还有一些示例HTML.它看起来不是所有格式在这里:)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
     "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
<TITLE>A document with SCRIPT</TITLE>
<META http-equiv="Content-Script-Type" content="text/tcl">
<SCRIPT type="text/vbscript" src="http://someplace.com/progs/vbcalc">
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT type="text/javascript">
...some JavaScript...
</SCRIPT>
</BODY>
</HTML>
Run Code Online (Sandbox Code Playgroud)

HTML 5中有一些值得期待的东西:

新的异步属性<SCRIPT>:

注意:有一些方法[原文如此]可以执行脚本:

async属性为"true":脚本将与页面的其余部分异步执行,因此脚本将在页面继续解析时执行.

async属性为"false",但defer属性为"true":脚本将在页面完成解析时执行.

  • 带有大写标签的代码是[W3.org规范](http://www.w3.org/TR/REC-html40/interact/scripts.html)的直接复制/粘贴. (11认同)
  • 只是看到所有标签都是用大写字母写的,这个答案的可信度大大降低...... (10认同)
  • @SebNilsson我想知道是否可以在主体部分放置脚本标签.这个答案说我可以,那么,为什么这些上限会降低它的可信度呢? (2认同)

Jam*_*mes 19

正常的比赛规则仍然有效; 在定义之前不要使用东西.:)

另外,请注意"将所有内容放在最底层"的建议并不是本书中唯一规则 - 在某些情况下它可能不可行,而在其他情况下,将脚本放在其他地方可能更有意义.

将脚本放在文档底部的主要原因是性能,脚本与其他HTTP请求不同,不要并行加载,这意味着它们会减慢页面其余部分的加载速度.将脚本置于底层的另一个原因是您不必使用任何"DOM就绪"功能.由于脚本标记位于所有元素之下,因此DOM可以进行操作!

编辑:阅读:http://developer.yahoo.com/performance/rules.html#js_bottom

  • @Brian - 我问过Jennyfofenny,她说如果javascript加载发生在文件的末尾会更好.通过这种方式,可以首先加载和索引上下文,从而可以更轻松地对页面进行索引,并使页面内容更自然地加载. (2认同)

Ala*_*lan 9

放置的一个方面是性能.请参阅YSlow讨论中的这篇精彩文章,了解为什么有时会建议您将它们放在文档的底部.

至于范围问题,据我所知,Javascript的常用可见性规则(在函数内部或外部定义的变量,本地,全局,闭包等)不会受到影响.