jQuery.fn.init(selector,context,rootjQuery):构造函数 jQuery.fn.init() 负责解析参数 selector 和 context 的类型,并执行相应的逻辑,最

后返回 jQuery.fn.init() 的实例,共有12个有效分支

源码分析

定义jQuery.fn.init(selector,context,rootjQuery)

init:function(selector,context,rootjQuery){

    var match,elem,ret,doc;

  }

参数 selector:可以是任意类型的值,但只有 undefined、DOM 元素、字符串、函数、jQuery 对象、普通 JavaScript 对象这几种类型是有效的,其他类型的值也可以接受但

没有意义

参数 context:可以不传入,或者传入 DOM 元素、jQuery 对象、普通 JavaScript 对象
之一

参 数 rootjQuery:包含了 document 对象的 jQuery 对 象, 用 于 document.getElement
ById() 查找失败、selector 是选择器表达式且未指定 context、selector 是函数的情况。
rootjQuery 的定义和应用场景的代码如下所示

参数 selector 可以转换为 false:例如是 undefined、空字符串、null 等,则直接返回 this,此时 this 是空 jQuery 对象,其属性 length 等于 0

参数 selector 是 DOM 元素:

如果参数 selector 有属性 nodeType,则认为 selector 是 DOM 元素,手动设置第一个元
素和属性 context 指向该 DOM 元素、属性 length 为 1,然后返回包含了该 DOM 元素引用的
jQuery 对象

参数 selector 是字符串“body”:

如果参数 selector 是字符串“ body”,手动设置属性 context 指向 document 对象、第一
个元素指向 body元素、属性 length 为 1,最后返回包含了 body 元素引用的 jQuery 对象

参数 selector 是其他字符串:

如果参数 selector 是其他字符串,则先检测 selector 是 HTML 代码还是 #id

第 126 ~ 128 行:如果参数 selector 以“ <”开头、以“ >”结尾,且长度大于等于 3,
则假设这个字符串是 HTML 片段,跳过正则 quickExpr 的检查。注意这里仅仅是假设,并不
一定表示它是真正合法的 HTML 代码,如“<div></p>”。
第 131 行:否则,用正则 quickExpr 检测参数 selector 是否是稍微复杂一些的 HTML 代
码(如“abc<div>”)或 #id,匹配结果存放在数组 match 中。

正则 quickExpr 包含两个分组,依次匹配 HTML 代码和 id。如果匹配成功,则数组
match 的第一个元素为参数 selector,第二个元素为匹配的 HTML 代码或 undefined(放到第二位),第三个
元素为匹配的 id 或 undefined(放到第三位)

41 quickExpr = /^(?:[^ # <]*(<[\w\W]+>)[^>]*$|#([\w\-]*)$)/,

(1)参数 selector 是单独标签,则调用document.createElement() 创建标签对应的 DOM元素。

第 135 行:检测正则 quickExpr 匹配参数 selector 的结果,如果 match[1] 不是 undefined,
即参数 selector 是 HTML 代码,或者 match[2] 不是 undefined,即参数 selector 是 #id,并且
未传入参数 context。

if ( match && (match[1] || match[2] && !context) )

如 果 match 不 是 null 且 match[1] 是 undefined,那么此时 match[2] 必然不是 undefined,
所以对 match[2] 的判断可以省略。

第 146 ~ 153 行: 如 果 数 组 ret 不 是 null,则认为参数 selector 是 单 独 标 签, 调 用
document.createElement() 创建标签对应的 DOM 元素;如果参数 context 是普通对象,则

jQuery 方法 .attr() 并传入参数 context,同时把参数 context 中的属性、事件设置到新创建的
DOM 元素上。

jQuery技术内幕预览版.pdf3的更多相关文章

  1. jQuery技术内幕预览版.pdf2

    第二章 构造jQuery对象 jQuery对象是一个类数组对象,含有连续的整型属性.length属性和大量的jQuery方法,$()是jQuery()的缩写 构造函数jQuery() 如果调用构造函数 ...

  2. jQuery技术内幕预览版.pdf1

    第一章 总体构架 jQuery模块可以分为3部分:入口模块.底层支持模块和功能模块 浏览器功能测试模块提供了针对不同浏览器功能和bug的测试结果,其它模块基于测试结果解决浏览器之间的兼容性问题 回调函 ...

  3. Windows 10 技术预览版9926 “未知源”引起系统休眠后自启的解决办法

    问题的由来: 自从安装上了最新发布的Windows 10 ,使用起来有诸多的改进:无论是重绘的图标还是通知消息中心的整合还是更智能的OneDrive客户端都使得工作起来非常愉悦. 不过笔者这两天频繁遇 ...

  4. 微软推出首个Microsoft Azure Stack技术预览版

    Mike Neil,微软公司企业云副总裁 怀着对于提高业务灵活性.加速创新的期待,很多企业正在向云平台迅速迁移.伴随着这样的趋势,我们也见证了微软智能云Azure业务在全球市场的快速增长--每个月近1 ...

  5. 熊猫猪新系统测试之一:Windows 10 技术预览版

    话说本猫不用windows很多年了呀!不过看到微软最新的Windows10还是手痒了,想安装体验一把.于是第一时间下载,并做成usb引导安装镜像,在08年的老台式机上安装尝鲜鸟.下载ISO和安装方法这 ...

  6. 微软发布Azure Stack第一个技术预览版

    为了提升商业灵敏度和加快创新步伐,各个企业都在迅速地转向云服务.在微软,我们已经见到微软智能云Azure的飞速发展和使用,每月我们都有近十万的新增订阅量.然而,我们也了解到还有很多企业在完全移到公有云 ...

  7. 熊猫猪新系统測试之中的一个:Windows 10 技术预览版

    话说本猫不用windows非常多年了呀! 只是看到微软最新的Windows10还是手痒了.想安装体验一把. 于是第一时间下载,并做成usb引导安装镜像,在08年的老台式机上安装尝鲜鸟.下载ISO和安装 ...

  8. 【官方免费】Apple Silicon M1 + Parallels 16技术预览版 + Win 10 arm64

    期待了好久,终于能用pd运行win10了,其实也就想写个c++,mac上配置个c++编译器太麻烦了.. 步骤: 打开 https://my.parallels.com/desktop/beta,这里下 ...

  9. 获取WIN10技术预览版

    说明 这是一款预发行软件 在进行商业发行之前,我们可能会对 Windows Technical Preview 进行大量修改. Microsoft 不对此处提供的信息作任何明示或默示的担保. 有些产品 ...

随机推荐

  1. C++ 智能指针auto_ptr详解

    1. auto_ptr 的设计动机: 函数操作经常依照下列模式进行: 获取一些资源 执行一些动作 释放所获取的资源 那么面对这些资源的释放问题就会出现下面的两种情况: 一开始获得的资源被绑定于局部对象 ...

  2. ubuntu 安装qq

    受不了webqq那个界面 ,各种不习惯 .今天在ubuntu 12.04LTS 版本中 ,终于装上了qq2012,下面介绍一下安装方法 1  安装 wine sudo  apt-get install ...

  3. 关于Linux内核学习的误区以及相关书籍介绍

    http://www.hzlitai.com.cn/article/ARM9-article/system/1605.html 写给Linux内核新手-关于Linux内核学习的误区 先说句正经的:其实 ...

  4. 常用命令su ls cp cd mv cat touch mkdir rm head less more pwd tac 等

    1.用户切换 su:switch user su kevin   //半切换,切换到kevin用户,但是不读取kevin用户的配置文件 su - kevin   //完全切换,执行这个命令的时候表示切 ...

  5. jsp 嵌套iframe 从iframe中表单提交并传值到外层

    今天因需求迭代 更改元来代码 遇到了这么个问题 就是想在 iframe中提交后进行整个页面的跳转 并把iframe中的值传到外层jsp 大概就是这个样子 外层 a.jsp <div id=&qu ...

  6. 非常实用的JQuery的选项卡切换源码

    <html> <head> <meta charset="utf-8"> <title>简单选项卡</title> &l ...

  7. H5小内容(四)

    SVG   基本内容     SVG并不属于HTML5专有内容       HTML5提供有关SVG原生的内容     在HTML5出现之前,就有SVG内容     SVG,简单来说就是矢量图     ...

  8. chmod 命令 set uid ,set gid,sticky bit 说明

    permission的符号模式表: 模式 名字 说明 r 读 设置为可读权限 w 写 设置为可写权限 x 执行权限 设置为可执行权限 X 特殊执行权限 只有当文件为目录文件,或者其他类型的用户有可执行 ...

  9. UM_第三方登录

    参考官方文档(http://dev.umeng.com/social/ios/detail-share#7), 做出以下总结. 第三方登录主要用于简化用户登录流程,通过用户拥有的微博.QQ.微信等第三 ...

  10. 【技术贴】解决QQ空间发表文章手机不显示换行

    采用HTML模式,在需要换行的地方加入如下代码. <div><span style="font-family:微软雅黑;font-size:16px"> & ...