如果你有JS代码打算作为加载/构建页面的一部分运行,HTML应该在哪里？例如,修改<div>或添加一些链接.这应该放在<body>HTML中穿插吗？还是应之间的<head>和<body>元素？事情发生了什么顺序 - 它们在页面中的顺序还是HTML都在(非<head>)JS运行之前发生？
T.J*_*der 35
如果你有JS代码打算作为加载/构建页面的一部分运行,HTML应该在哪里？
就在关闭</body>标签出现之前,最好的做法是禁止在其他地方(有时可能会出现这种情况)的特定要求.例如,这是YUI人员的推荐,但不仅仅是他们.
事情发生了什么顺序 - 它们在页面中的顺序还是HTML都在(非)JS运行之前发生？
当script遇到标签,除非您使用defer或async属性(和浏览器支持它们),所有的HTML解析来个急刹车和脚本下载并交给JavaScript解释器.当JavaScript解释器完成处理脚本时,HTML解析器可以继续.它必须这样做,因为JavaScript可以通过标记将令牌插入到HTML流中document.write.这也是为什么你可以加载脚本文件,然后加载第二个脚本文件,依赖于第一个脚本文件,并知道它们将以正确的顺序加载.这也是为什么除非你以某种方式推迟你的代码(window.onload或许多库支持的"DOM加载"事件,如jQuery ready或Prototype dom:loaded),否则你无法访问HTML流中更低层的元素.
这样的一个结果是,把典型做法script标签在head实际减慢页面明显加载时间,除非这些script标签必须是有某种原因.因此建议将它们放在结束</body>标记之前.
但是,你需要注意一个"问题":如果用户已经启用了你想要用JavaScript响应的部分页面,那么在最后加载你的脚本会留下一个短暂而真实的竞争状态around:用户可以在下载脚本时与页面进行交互.有多种处理方式.我最喜欢的是检测JavaScript是否在元素中使用内联脚本(而不是单独的文件)启用head,如果是,则在可能的情况下放入文档级处理程序(例如,可以使用click事件执行此操作)在很短的时间内基本上排队或禁用点击.这样,如果启用了JavaScript,您将避免竞争条件,但如果不是,那么您所拥有的任何不显眼的后备都将起作用.
hen*_*nes 10
整个HTML文件按写入顺序执行,这意味着
<html>
<div id="ID"></div>
<script type="text/javascript">
document.getElementById('ID').innerHTML = "HELLO";
</script>
</html>
更改div的内容,wherease
<html>
<script type="text/javascript">
document.getElementById('ID').innerHTML = "HELLO";
</script>
<div id="ID"></div>
</html>
没有,因为JS代码是在div加载之前执行的.
编辑:如果你想在页面加载后运行JS,请使用window.onload或document.body.onload或
<body onload="...">
或者,如果您使用的是jQuery等JS库,则可以使用
$(document).ready(function() {
...
});