jQuery 的入口函数 jQuery.fn.init
。(jQuery.prototype.init
)
$()常用的选择器接口:
$()
,空参数,这个会直接返回一个空的 jQuery 对象,即:
对象:
$(this) $(document)把传入的对象包装成jQuery对象
函数
$(function(){})dom文档加载完成后,加载执行的。等效于dom加载完毕后执行了 $(document).ready方法。
传入字符串:
查询dom节点
创建dom节点
if ( !selector ) {
//HANDLE: $(""), $(null), $(undefined), $(false)
}
if ( typeof selector === "string" ) {
//Handle HTML 标签
} else if ( selector.nodeType ) {
//传入的是element对象
} else if ( isFunction( selector ) ) {
// 传入的是函数
}
jQuery针对字符串部分又做了区分:
merge: function( first, second ) {
var len = +second.length,
j = 0,
i = first.length;
for ( ; j < len; j++ ) {
first[ i++ ] = second[ j ];
}
first.length = i;
return first;
},
if ( selector[ 0 ] === "<" &&
selector[ selector.length - 1 ] === ">" &&
selector.length >= 3 ) {
//表示创建dom节点
} else {
match = rquickExpr.exec( selector );
//表示查找dom节点
}
//其中:rquickExpr = /^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,
针对查找dom节点:match = rquickExpr.exec( selector );根据match判断为id选择器,类选择器或者标签选择器
jQuery.find = Sizzle;
function Sizzle(selector, context, results, seed) {
if (typeof selector !== "string" || !selector || nodeType !== 1 && nodeType !== 9 && nodeType !== 11) {
return results;
}
// Try to shortcut find operations (as opposed to filters) in HTML documents
if (!seed) {
if ((context ? context.ownerDocument || context : preferredDoc) !== document) {
// setDocument 函数其实是用来将 context 设置成 document,考虑到浏览器的兼容性
setDocument(context);
}
context = context || document;
// true
if (documentIsHTML) {
// match 就是那个有规律的数组
if (nodeType !== 11 && (match = rquickExpr.exec(selector))) {
// selector 是 id 的情况
if ((m = match[1])) {
// selector 是 tagName 情况
} else if (match[2]) {
// selector 是 class 情况
} else if ((m = match[3]) && support.getElementsByClassName && context.getElementsByClassName) {
}
}
}
}
return select(selector.replace(rtrim, "$1"), context, results, seed);
}
另外提一句:如果传入函数:
// HANDLE: $(function)
// Shortcut for document ready
} else if ( isFunction( selector ) ) {
return root.ready !== undefined ?
root.ready( selector ) :
// Execute immediately if ready is not present
selector( jQuery );
}
root = root || rootjQuery;
rootjQuery = jQuery( document );
所以:$(function(){})dom文档加载完成后,加载执行的。等效于dom加载完毕后执行了 $(document).ready方法。
如何创建dom元素呢?
jQuery.merge( this, jQuery.parseHTML(selector,context))使用到了merge方法:
this是一个$()对象,第二个参数是一个数组(创建的dom节点)
由于$().length=0,
merge: function( first, second ) {
var len = +second.length,//+ 把后面的内容转成 number 类型。至于length值为啥可能会存在不是number的情形?我也不知道。。。。
j = 0,
i = first.length;
for ( ; j < len; j++ ) {
first[ i++ ] = second[ j ];
}
first.length = i;
return first;
},
所以二者是可以merge的。