关于JQ中ready()方法的几种写法总结

——习惯贵在坚持,天才在于积累。

  好久没写博客的我,似乎是忘记了当初写博客的初衷是要在博客笔记中提升自己的写作能力和积累自己的知识要点。

  废话不多说。

 

ready()方法作用:

  在页面加载完成后,立即执行指定的函数。这么做的好处是可以减少页面渲染的时间,加快页面加载,提升用户体验(自己理解,如有不对,欢迎评论指正。)

ready()相比onload事件绑定函数的优势:

  具有较高优先级,只需等到html结构加载完成后即可执行;而onload必须等到图片在内的所有元素加载完毕后才执行。除了使用target选择器时需要结合window.onload,大多数我们都可以使用ready()来进行编写js代码。

 

 ——————————————————重点内容分割线————————————————————

1.$().ready(()=>{ });

  //自己最常写的一种方式,结合了ES6的箭头函数写法。可能是写久了习惯了,就忽然想看看到底有几种其他写法,希望对有这种突发奇想的朋友们有帮助。( 等价于$().ready(function(){ }) )

2.$(()=>{ });

  //这是我发现了一个更简洁的写法,没准以后会常用。

3.$(document).ready(()=>{ });

  //这种写法好像和第一种没什么区别,我想可能写document的原因可能就是应为$符号的不稳定性,$()是一种选择器,如果存在多个js库时,可能会将控制权转移给其他的js库。

4.还有两种写法就是将上面的写法中的$替换成JQuery。

  换过来的用意是因为“$”符号并不是很稳定,而JQuery更能适应各种浏览器版本DOM。不过在我使用“$”期间基本没出现过什么问题,对于这个符号的用法所出现的现实问题,也就在编译器Webstorm中会发出警告,对于转移js库的问题未出现过。不过基于个人现实情况而定,仅供参考。

  ——————————————————重点内容分割线————————————————————

注: ready()不能和window.onload共用。

 

参考链接:http://www.365mini.com/page/jquery-ready.htm

 

——欢迎各路大佬给予批评指正,同时欢迎补充和探讨。

posted @ 2019-03-11 15:35  风兮潇潇  阅读(2224)  评论(0编辑  收藏  举报