jQuery知识点(2)-页面初始化函数

来源：互联网发布：零一数据分析编辑：程序博客网时间：2024/05/19 20:44

知识点-BOM与DOM

BOM指的是浏览器对象模型，也就是说在JavaScript语言中，将浏览器封装为一个window对象，例如：window.location.href就表示当前页面的url地址。

DOM指的是文档对象模型，其实DOM就是window.document，因为太常用了，所以可以直接用document，它指的是<html>与</html>之间的html文档。

知识点-window.onload

window.onload代表窗口页面全部加载完毕（包括图片等）后触发的事件，例如：

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><script src="jquery.min.js"></script><title></title><script>    window.onload=init;    function init(){        console.log("页面全部加载完毕");    }</script></head><body></body></html>

知识点-jQuery中的页面初始化

其实很多时候，无需等待页面所有内容加载完毕再去执行初始化，毕竟只要整个文档结构定下来了，就可以去填充内容了（比如菜单、比如表格内容的信息，无需等待图片下载完了再显示，这样整个页面加载更流畅）。

所以，最好的时机是在document，即网页的html文档加载完毕后执行一个初始化方法，最佳。

jQuery提供了$(document).ready用于指定初始化方法，含义就是document对象加载完毕了执行的方法。

例如：

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><script src="jquery.min.js"></script><title></title><script>    $(document).ready(init);//指定init方法为document对象加载完毕后执行的方法    function init(){        console.log("document加载完毕");    }</script></head><body></body></html>

of course，也可以直接指定函数：

<script>    $(document).ready(        function(){            console.log("document加载完毕");        }    );</script>

最后，因为这个初始化方法太常用了，所以jQuery提供了简写，确实够简单了，但是俺觉得这种写法对意义表达的不明确，所以还是上面的较好，当然萝卜白菜各有所爱，肯定也有更喜欢这种简洁优雅的写法的。

<script>    $(function(){        console.log("document加载完毕");    });</script>

阅读全文

0 0