Html5页面加载初始调用 JavaScript 代码的三种方式:
1、body 的 onload 事件触发回调 JavaScript 函数
body onload="init()"
该事件在 document 文档中的所有内容都加载完成后才会被调用,这种方式显得有点笨拙,但比较把握,确保一切安好,才去调用。
如想避勉过多加载,那么页面设计上可以相对讲究些方法,人为达到滞后加载的效果,就可以给这个事件进行减压,达到尽快执行的目标。
2、document 的 onready 事件触发回调 JavaScript 函数
document.onready = init();
该事件在 document 文档中的 dom 模型加载完成就会产生回调,而不考虑引用的图片、脚本等资源。
3、在引入 Html5 页面的 JavaScript 代码中,直接调用 JavaScript 函数或执行 JavaScript 命令
或在外部 js 脚本中,直接调用 init();
init() 可以是 Html5 页面中声明的函数,也可以是外部引用的脚本中的函数。
不过发现一个有趣的问题,当在 init() 函数定义中,通过
document.getElementById('container');
获取 container 元素的引用时,如果该 Html5 元素在该段页面内 JavaScript 代码之后时,会获取不到该元素。
这说明一个问题,第三种启动执行方式,是边加载边执行,所以对顺序有要求。