原生的JS的入口函数指的是:window.onload = function(){}: 如下所示:
//原生js的入口函数。页面上所有内容加载完毕, 才执行。
//不仅要等文本加载完毕, 而且要等图片也加载完毕, 才执行函数。
<script type="text/javascript">
window.onload = function () {
alert("hello");
}
</script>
而jQuery的入口函数, 有以下几种写法:
写法一:
//文档加载完毕, 图片不加载的时候, 就可以执行这个函数。
<script type="text/javascript">
$(document).ready(function () {
alert("hello");
})
</script>
写法二:(写法一的简洁版)
//文档加载完毕, 图片不加载的时候, 就可以执行这个函数。
<script type="text/javascript">
$(function () {
alert("hello");
})
</script>
写法三:
//文档加载完毕, 图片也加载完毕的时候, 再执行这个函数。
<script type="text/javascript">
$(window).ready(function () {
alert("hello");
})
</script>
jQuery入口函数和js入口函数的区别:
区别一: 书写个数不同:
(1)JS的入口函数只能出现一次, 出现多次会存在事件覆盖的问题。
(2)jQuery的入口函数, 可以出现任意多次, 并不存在事件覆盖问题。
区别二:执行时机不同:
(1)JS的入口函数是在所有的文件资源加载完成后, 才执行。这些文件资源包括:页面文档、外部的JS文件、外部的CSS文件、图片等。
(2)jQuery的入口函数, 是在文档加载完成后就执行。 文档加载指的是:DOM树加载完成后, 就可以操作DOM了, 不用等到所有的外部资源都加载成功。
Ps: 文档加载的顺序为:从上往下, 边解析边执行。