模拟代码-1 jQuery实现原理的核心部分

在核心部分，实现了两个选择器，使用id和标记名，还可以提供css设置和文本设置。复制代码如下： //#表示jQuery 1.4.2中对应的行数。//变量undefined使用方便；var undefined=undefined//jQuery是一个函数，它实际上调用jQuery.fn.init来创建一个对象var $=jquery=window。$=window.jquery//# 19=函数(选择器，上下文){返回new jquery.fn.init(选择器，上下文)；};//用于检查是否为id id expr=/#([\ w-])$/；//将jQuery的prototype对象设置为所有jQuery对象共享jQuery . fn=jQuery . prototype={//# 74 length 33600，//# 190jquery:' 1.4.2 '，//# 187//这是一个例子。只有两个选项：id和标记名init:function(选择器，上下文){//# 75//处理html字符串if(选择器的类型==' string '){//我们处理的是html字符串还是id？match=idExpr.exec(选择器)；//验证匹配，并且没有为#id指定上下文if(匹配匹配[1]){ var elem=document . getelementbyid(匹配[1])；if(elem){ this . length=1；this[0]=elem；}} else {//直接使用标记名varnodes=document . getelementsbytagname(选择器)；for (var l=nodes.length，j=0；j l；j){ this[j]=nodes[j]；} this . length=nodes . length；} this.context=documentthis.selector=selector归还这个；}}，由///size : function(){//# 193 returnthis . length表示的DOM对象数；}，//用于设置css样式css:function (name，value) {//# 4564this。每个(函数(名称，值){this。样式[名称]=值；}，arguments //实际参数是以数组的形式传递的)；归还这个；}，//用于设置文本内容text:函数(val) {//# 3995if (val) {this。每个(函数(){this。innerhtml=val}，arguments //实际的参数是以数组的形式传递的)}返回这个；}，//用于操作所有DOM对象//回调自定义回调函数//args自定义参数each:function(回调，args) {//# 244returnjquery。每个(this、callback、args)；} }//init函数的原型也是jQuery的原型，jQuery . fn . init . prototype=jQuery . prototype；//#303 //用于遍历jquery对象jQuery中包含的元素。每个=函数(对象、回调、args) {//# 550 var I=0，length=object.length//未提供参数if(args===undefined){ for(var value=object[0])；I长度回调. call(value，I，value)！==falsevalue=object[I]){ } } else { for(；一、长度；){ if (callback.apply(object[i ]，args)==false){ break；}}}}在jQuery中，jQuery对象实际上是一个模仿数组的对象，它表示通过选择器获得的所有DOM对象的集合。像数组一样，它有一个长度属性，表示所表示的DOM对象的数量，并且可以被下标遍历。JQuery .第95行中的每一个都是jquery中用来遍历这个仿拟数组并遍历其中每个元素的基本方法。回调表示处理这个DOM对象的函数。通常，我们不使用这个方法，而是使用jQuery对象的每个方法来遍历。在内部，jQuery对象的css和text方法实际上使用jQuery对象的每个方法来处理所选元素。关于这些函数和对象之间的关系，请参见jQuery原型图。

以下脚本使用此脚本库。复制代码如下： //原型操作$ ('h1 ')。文字('你好，世界').CSS('颜色'，'绿色')；