• Works
    • 笔记
    • 资源
  • 关于我

拉风的博客

源码

jQuery源码剖析(四)——$(document).ready

Posted by raphealguo on 30 一月, 2013 1 Comment
作者:raphealguo    文章来自http://rapheal.sinaapp.com/tag/%E6%BA%90%E7%A0%81/page/2/

前言

在浏览器把DOM树渲染好之前,javascript是无法操作没渲染好的DOM节点。
例如:

javascript
1
2
3
4
5
6
  <script>
    var dom = document.getElementById("test");
    //由于script先执行,此时浏览器的还没渲染id为test的DOM节点,所以这里拿不到
  </script>
  <div id="test">
  </div>

这是很多新手在操作DOM树容易犯的错:在文档DOM就绪前就取DOM节点。
jQuery提供了ready函数,你可以在ready里边添加回调,jQuery会保证在文档就绪后依次执行这些回调。 [Read more...]

Posted in: javascript, jQuery源码, 源码 | Tagged: jQuery, 源码

jQuery源码剖析(三)——$.Deferred

Posted by raphealguo on 26 一月, 2013 2 Comments
作者:raphealguo    文章来自http://rapheal.sinaapp.com/tag/%E6%BA%90%E7%A0%81/page/2/

前言

接上一篇《jQuery源码剖析(二)——$.Callbacks》,对于javascript来说,回调这个概念无处不在,bang上次还抱怨nodejs里边读取文件内容都要回调,这里读取文件内容其实就是异步的场景。异步真是无处不在的:ajax请求,页面动画。
对于读取文件内容这个场景,通过$.Callbacks来表述读取某个文件的场景,就是以下代码:

javascript
1
2
3
4
5
6
7
8
9
10
var callbacks = $.Callbacks();
callbacks.add(function(){
  alert('读取到内容');
});
callbacks.add(function(content){
  alert('内容:' + content);
});
read('raphealguo.txt', function(content){
  callbacks.fire(content);
});

显然这样的做法不优雅,每次要读一个文件必须定义一个callback管理器实例。
而且读取文件有可能有失败的情况,这样就还得要去定义多一个callback管理器去处理失败的回调队列。 [Read more...]

Posted in: javascript, jQuery源码, 源码 | Tagged: jQuery, 源码

jQuery源码剖析(二)——$.Callbacks

Posted by raphealguo on 25 一月, 2013 5 Comments
作者:raphealguo    文章来自http://rapheal.sinaapp.com/tag/%E6%BA%90%E7%A0%81/page/2/

前言

上一篇《jQuery源码剖析(一)——概览&工具方法》最后说要了解一下jQuery的ready实现。
为了彻底理解jQuery的ready实现,所以需要理解什么是异步队列。
为了彻底理解jQuery的异步队列实现,所以需要理解什么是回调函数队列管理器(姑且叫这个名字吧,其实就是jQuery.Callbacks)。
可以看到学习实际上就是一个拓扑的问题,这篇文章完全是剖析$.Callbacks的原理&实现。
官方文档上写到$.Callbacks的用途:

A multi-purpose callbacks list object that provides a powerful way to manage callback lists.

$.Callbacks是在1.7的版本之后新增的,它提供了一些很优美的方法来管理回调函数队列。 [Read more...]

Posted in: javascript, jQuery源码, 源码 | Tagged: jQuery, 源码

jQuery源码剖析(一)——概览&工具方法

Posted by raphealguo on 17 一月, 2013 20 Comments
作者:raphealguo    文章来自http://rapheal.sinaapp.com/tag/%E6%BA%90%E7%A0%81/page/2/

前言

其实这剖析jQuery源码系列文章是我自己酝酿很久的想法,当然因为之前的不成熟以及理解不深刻一直不敢提笔写。近期阅读的书籍多,激发我写文章的欲望,于是把这个计划开始实施。

为什么要选择jQuery源码,我想对于一个前端开发人员来说,不言自明。jQuery的出现对于众多前端开发人员来说,是一个无比强大的武器。那为什么jQuery如此流行,深得大家喜欢?我认为秘籍就在于jQuery的API设计。

在jQuery的设计中,最主要的两块就是(个人看法):

  1. 提供工具方法;
  2. DOM元素的操作,包括选取,属性取值等等。

对于一个库来说,第一点是必然要有所体现的,没有基础的工具方法,如何成为库。

对于Javascript来说,最重要的一块就是DOM操作,jQuery在DOM操作这块的贡献是巨大的,以至于现在很多新手完全不会用原生的JS API(例如document.getElementById等)了,jQuery把复杂的DOM选取映射到了简单的CSS选择器,对复杂的DOM操作(不同浏览器的DOM操作接口不一致)封装非常简单的委托API,以达到其核心的目的:The Write Less, Do More。 [Read more...]

Posted in: javascript, jQuery源码, 源码 | Tagged: jQuery, 源码
« 上一页 1 2

标签

BFS CA CSS dfs ExtCSS HTTP HTTPS jQuery MVVM PHP源码 Sizzle ssl uglifyjs Vue Vue2.x webview模拟器 Web开发 Zend源码 上线 云南游 入门 前端工程 加密 协议 工具 提测 效率 数字签名 数学 旅游 游戏 源码 灰度 监控 硬件 算法 网络模型 计算机 认证

近期评论

  • Augustmyv 发表在《如何学习Vue2源码》
  • Holographicuqj 发表在《如何学习Vue2源码》
  • Foamcub 发表在《如何学习Vue2源码》
  • liusir 发表在《关于我》
  • 匿名 发表在《一次安全可靠的通信》

链接表

  • bang
  • DIV.IO
  • 小木舟

Copyright © 2021 拉风的博客.

Theme by ThemeHall.