转载请保留此句:太阳火神的美丽人生 - 本博客专注于敏捷开发及移动和物联设备研究:iOS、Android、Html5、Arduino、pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作。
首先,来看一下 Html5 页面引用 JavaScript 代码的几种方式:
1、Html5 页面中使用
init();
这里不仅可以调用任意位置的函数,而且可以声明变量,构建函数和对象等等。
2、Html5 页面中使用 引入同路径下的 xxx.js 文件中的 JavaScript 代码;
注意这里的 main.js 是与当前 Html 页面文件同目录下的 js 子目录中的文件,使用时,确保相对路径正确,当然了,也可以使用绝对路径。
3、Html5 界面元素事件直接赋与一段 JavaScript 代码;
以下资源可供参考,进一步理解 JavaScritp:JavaScript的5种调用函数的方法
要想真正掌握 JavaScript 语言,那么闭包是必须要深刻理解和领悟的核心。
顺便,记录一下引用 CSS 的几种方式:
1、外部样式表
css 样式存于一个 .css 扩展名的文件中,引用方式:
2、内部样式表
page标题
input{background-color:Green}
3、内联样式
更详细的 CSS 运用,可参考
最后,切入主题,页面加载初始调用 JavaScript 代码的三种方式:
1、body 的 onload 事件触发回调 JavaScript 函数;
如想避勉过多加载,那么页面设计上可以相对讲究些方法,人为达到滞后加载的效果,就可以给这个事件进行减压,达到尽快执行的目标。
2、document 的 onready 事件触发回调 JavaScript 函数;
document.onready=init();该事件在 document 文档中的 dom 模型加载完成就会产生回调,而不考虑引用的图片、脚本等资源。
3、在引入 Html5 页面的 JavaScript 代码中,直接调用 JavaScript 函数或执行 JavaScript 命令;
init();
或在外部 js 脚本中,直接调用 init();
init() 可以是 Html5 页面中声明的函数,也可以是外部引用的脚本中的函数。
不过发现一个有趣的问题,当在 init() 函数定义中,通过
document.getElementById('container');获取 container 元素的引用时,如果该 Html5 元素在该段页面内 JavaScript 代码之后时,会获取不到该元素。
这说明一个问题,第三种启动执行方式,是边加载边执行,所以对顺序有要求;
每时每刻,都有老人变新人,老手涉猎新事物,变潮人,接触陌生的领域,变新手。
凡事都有这个过程,新领域的成熟与否,其实你与无太大关系,你还是一样的新;
但这个领域的成熟,标志着,有这么多别人分享的东西,可供参考,内在的 bug 也会少很多;
但无论怎样,在你的头脑里,还是需要一点点去塞满,
并不代表,这个领域有多少,你就有多少,
也不代表,你一下子就能把这个领域成熟的东西就全能掌握,
那是需要不断理解、实践,总结、升华,以便再进一步获取更深层次理解的过程,
唐僧取到的经书,如果不被水泡了,可能我们真的就能去掉这个理解的过程了,
悟性确实是可以很高的,这个高真能达到不需要理解的过程?!
。。。。。。
如果觉得《html打开页面自动调用函数 Html5 页面中 JavaScript 启动调用的三种方法比较》对你有帮助,请点赞、收藏,并留下你的观点哦!