经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » JS/JS库/框架 » jQuery » 查看文章
jQuery-ready与load
来源:cnblogs  作者:Tynam.Yang  时间:2019/6/21 8:47:36  对本文有异议
 
// ready 在DOM加载完成时运行的代码
  1. $(document).ready(function(){
  2. // 在这里写代码...
  3. })
// 可以简写为
  1. $(function(){
  2. // 在这里继续使用$作为别名...
  3. })

 

// load 页面加载完毕后运行代码
  1. $(document).load(function(){
  2. // 在这里写你的代码...
  3. })

 

区别一:ready 会先于 load 执行
  了解浏览器加载页面的过程
    1、 解析HTML结构,对html文档进行加载
    2、 加载外部表文件,包含css样式和javascript脚本,并且执行
    3、 html执行完毕
    4、 加载图片、字体等外部文件
    5、页面加载完成

 

  ready:是在DOM元素加载完成就执行,也就是说在上面的步骤3执行完成后就执行,不需要等待图片、字体等外部文件的加载
  load:是在页面加载完成后才执行,在上面步骤5完成后才执行。
  所以按照浏览器的加载页面步骤来说,ready 会比 load先执行

 

区别二:load 只能编写一个,ready可以编写多个
load编写:
  1. $(document).load(function(){
  2. alert("load1...");
  3. });
  4. $(document).load(function(){
  5. alert("load2...");
  6. });
执行后只输出了 load2...
因为他只能执行一个,如果有多个的情况,后面的会覆盖前面的

 

ready编写:
  1. $(document).ready(function(){
  2. alert("ready1...");
  3. });
  4. $(document).ready(function(){
  5. alert("ready2...");
  6. });
执行后两次都输出:ready1...
          ready2...

 

区别三:ready 有简写,而load没有
ready简写:
  1. $(function(){
  2. // ready简写,在这撸代码
  3. })

  

原文链接:http://www.cnblogs.com/tynam/p/11061760.html

 友情链接:直通硅谷  点职佳  北美留学生论坛

本站QQ群:前端 618073944 | Java 606181507 | Python 626812652 | C/C++ 612253063 | 微信 634508462 | 苹果 692586424 | C#/.net 182808419 | PHP 305140648 | 运维 608723728

W3xue 的所有内容仅供测试,对任何法律问题及风险不承担任何责任。通过使用本站内容随之而来的风险与本站无关。
关于我们  |  意见建议  |  捐助我们  |  报错有奖  |  广告合作、友情链接(目前9元/月)请联系QQ:27243702 沸活量
皖ICP备17017327号-2 皖公网安备34020702000426号