胖蔡叨叨叨
你听我说

jQuery从$开始

jQuery requires a window with a document.jQuery版本3.6.0

使用jQuery的第一行代码总是从$(document).ready(function(){});或者$(function(){});开始,我从jQuery执行过程去了解$是怎么被识别并被使用的。

jQuery 入口函数

jQuery根据不同的js运行时环境将jQuery实例挂载到不同属性上。如果是浏览器引用,则挂载到window的$上,如果是require方式在例如node.js环境引用,则需要判断当前环境的文档流在哪一层(写此博客时还没有搭建node环境,这里没有做验证,只是想法猜测),jQuery需要运行在有文档流的环境中。

javascript
(function(global, factory){
	if ( typeof module === "object" && typeof module.exports === "object" ) {
		module.exports = global.document ?
			factory( global, true ) :
			function( w ) {
				if ( !w.document ) {
					throw new Error( "jQuery requires a window with a document" );
				}
				return factory( w );
			};
	} else {
		factory( global );
	}
	
})(typeof window !== "undefined" ? window : this, function( window, noGlobal ) {

	var jQuery = function( selector, context ) {
		return ...;
	};
	
	var _jQuery = window.jQuery, _$ = window.$;

    jQuery.noConflict = function( deep ) {
    	if ( window.$ === jQuery ) {
	    	window.$ = _$;
	    }

    	if ( deep && window.jQuery === jQuery ) {
	    	window.jQuery = _jQuery;
    	}

	return jQuery;
    };

	if ( typeof noGlobal === "undefined" ) {
		window.jQuery = window.$ = jQuery;
	};
	
	return jQuery;
});

jQuery提供了noConflict方法,解决$可能与其他框架同名产生冲突的问题,同时如果jQuery运行在没有window属性的环境中,也不能使用$。可以通过noConflict方法重新定义一个属性。

jQuery初始化

预告为了防止文档在没有完全加载之前运行jQuery代码,即在Dom加载完成后才可以对Dom进行操作,jQuery所有函数都位于document ready函数中。

赞(0) 打赏
转载请附上原文出处链接:胖蔡叨叨叨 » jQuery从$开始
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏