jQuery源码学习笔记二 转

<p>前文提要,jQuery用init方法创建的,它是jQuery.fn.init的实例而非jQuery的实例,后期会用jQuery.fn.init.<wbr>prototype =<wbr> <wbr>jQuery.fn;把相应的能力从jQuery.prototype搬运到jQuery.fn.init.prototype上。因此,init之后,作者就放心地往jQuery的原型添加方法。而这些原型更多的时候是往外调用其静态方法来工作。一开始,都是一些用于构建类数组的东西。像setArray,makeArray,size,get,pushStack等方法。</p>

<pre class="brush:javascript;gutter:false;toolbar:false">
//&#64;author  司徒正美|なさみ|cheng http://www.cnblogs.com/rubylouvre/  All rights reserved
     //另一个复杂的方法
	css: function( key, value ) {
		// ignore negative width and height values
		if ( (key == 'width' || key == 'height') && parseFloat(value) &lt; 0 )
			value = undefined;
		return this.attr( key, value, "curCSS" );
	},
   //与css与attr一样,既能读亦能写
	text: function( text ) {
		if ( typeof text !== "object" && text != null )
			return this.empty().append( (this[0] && this[0].ownerDocument || document).createTextNode( text ) );

		var ret = "";

		jQuery.each( text || this, function(){
			jQuery.each( this.childNodes, function(){
				if ( this.nodeType != 8 )
					ret += this.nodeType != 1 ?
						this.nodeValue :
						jQuery.fn.text( [ this ] );
			});
		});

		return ret;
	},

    //把匹配的元素作出了为一个整体用参数里的标签(如果传入的是元素也会转换为标签)包起来,
    //$("p").wrapAll('&lt;div&gt;&lt;/div&gt;') =&gt;  &lt;div&gt;&lt;p&gt;******&lt;/p&gt;&lt;p&gt;******&lt;/p&gt;&lt;p&gt;******&lt;/p&gt;&lt;/div&gt;

    //这东西应该叫wrapOutter更好
	wrapAll: function( html ) {
		if ( this[0] ) {
			// The elements to wrap the target around
			var wrap = jQuery( html, this[0].ownerDocument ).clone();

			if ( this[0].parentNode )
				wrap.insertBefore( this[0] );

			wrap.map(function(){
				var elem = this;

				while ( elem.firstChild )
					elem = elem.firstChild;

				return elem;
			}).append(this);
		}

		return this;
	},
    //相当于把匹配的元素取得其innerHTML,然后用wrapAll方法包起来
    //$("p").wrapInner('&lt;div&gt;&lt;/div&gt;') =&gt;  &lt;p&gt;&lt;div&gt;******&lt;/div&gt;&lt;/p&gt;&lt;p&gt;&lt;div&gt;******&lt;/div&gt;&lt;/p&gt;&lt;p&gt;&lt;div&gt;******&lt;/div&gt;&lt;/p&gt;

   wrapInner: function( html ) {
		return this.each(function(){
			jQuery( this ).contents().wrapAll( html );
		});
	},
//与上面相反,有点像outterHTML,内容外面加一层皮
//$("p").wrap('&lt;div&gt;&lt;/div&gt;') =&gt;  &lt;div&gt;&lt;p&gt;******&lt;/p&gt;&lt;/div&gt;&lt;div&gt;&lt;p&gt;******&lt;/p&gt;&lt;/div&gt;&lt;div&gt;&lt;p&gt;******&lt;/p&gt;&lt;/div&gt;

	wrap: function( html ) {
		return this.each(function(){
			jQuery( this ).wrapAll( html );
		});
	},
</pre>
<p>接着下来分析append,prepend,before,after。内部实现非常复杂,先扼要类比一下已有的API吧。</p>
<pre class="brush:javascript;gutter:false;toolbar:false">
//append:向每个匹配的元素内部追加内容。
//相当于
//insertAdjacentHTML("beforeEnd",htmlstr)
//insertAdjacentElement("beforeEnd",dom)
//insertAdjacentElement("beforeEnd",jQueryEl)
//并且具有处理复数个DOM对象的能力(内部用jQuery.each实现)
</pre>
<pre class="brush:javascript;gutter:false;toolbar:false">
//prepend:向每个匹配的元素内部前置内容。
//相当于
//insertAdjacentHTML("afterBegin",htmlstr)
//insertAdjacentElement("afterBegin",dom)
//insertAdjacentElement("afterBegin",jQueryEl)
//并且具有处理复数个DOM对象的能力(内部用jQuery.each实现)
</pre>
<pre class="brush:javascript;gutter:false;toolbar:false">
//before:在每个匹配的元素之前插入内容。
//相当于
//insertAdjacentHTML("beforeBegin",htmlstr)
//insertAdjacentElement("beforeBegin",dom)
//insertAdjacentElement("beforeBegin",jQueryEl)
//并且具有处理复数个DOM对象的能力(内部用jQuery.each实现)
</pre>
<pre class="brush:javascript;gutter:false;toolbar:false">
//after:在每个匹配的元素之后插入内容。。
//相当于
//insertAdjacentHTML("afterEnd",htmlstr)
//insertAdjacentElement("afterEnd",dom)
//insertAdjacentElement("afterEnd",jQueryEl)
//并且具有处理复数个DOM对象的能力(内部用jQuery.each实现)
</pre>

<p>这些方法内部都调用一个叫domManip的方法,它的存在价值仅仅是为了兼容邪恶的火狐,因为火狐死活不支持IE的insertAdjacentXXX系列。</p>
<pre class="brush:javascript;gutter:false;toolbar:false">
//&#64;author  司徒正美|なさみ|cheng http://www.cnblogs.com/rubylouvre/  All rights reserved
//主要用于返回上次覆盖了DOM元素数组
      end: function() {
        return this.prevObject || jQuery( [] );
      },
      
      // For internal use only.
      // Behaves like an Array's method, not like a jQuery method.
      push: [].push,
      sort: [].sort,
      splice: [].splice,
      //jQuery强大的CSS选择器
      find: function( selector ) {
        if ( this.length === 1 ) {
          var ret = this.pushStack( [], "find", selector );
          ret.length = 0;
          //分别为表达式,上下文,与之前获得的元素集合(它们将作为此次的搜索起点)
          jQuery.find( selector, this[0], ret );
          return ret;
        } else {
          //每次都会重新洗牌,因此必须进行压栈操作
          return this.pushStack( jQuery.unique(jQuery.map(this, function(elem){
            return jQuery.find( selector, elem );
          })), "find", selector );
        }
      },
      //先复制DOM再复制其上的事件
      clone: function( events ) {
        // Do the clone
        var ret = this.map(function(){
          if ( !jQuery.support.noCloneEvent && !jQuery.isXMLDoc(this) ) {
            // IE copies events bound via attachEvent when
            // using cloneNode. Calling detachEvent on the
            // clone will also remove the events from the orignal
            // In order to get around this, we use innerHTML.
            // Unfortunately, this means some modifications to
            // attributes in IE that are actually only stored
            // as properties will not be copied (such as the
            // the name attribute on an input).
            var html = this.outerHTML;
            
            if ( !html ) {
              var div = this.ownerDocument.createElement("div");
              div.appendChild( this.cloneNode(true) );
              html = div.innerHTML;
            }
            //将字符串转换成jQuery对象
            return jQuery.clean([html.replace(/ jQuery\d+="(?:\d+|null)"/g, "").replace(/^\s*/, "")])[0];
          } else
            return this.cloneNode(true);
        });
        //许多是后面的方法,到时再说
        // Copy the events from the original to the clone
        if ( events === true ) {
          var orig = this.find("*").andSelf(), i = 0;
          
          ret.find("*").andSelf().each(function(){
            if ( this.nodeName !== orig[i].nodeName )
              return;
            
            var events = jQuery.data( orig[i], "events" );
            
            for ( var type in events ) {
              for ( var handler in events[ type ] ) {
                jQuery.event.add( this, type, events[ type ][ handler ], events[ type ][ handler ].data );
              }
            }
            
            i++;
          });
        }
        
        // Return the cloned set
        return ret;
      },
      //如果参数是函数则用jQuery.greg,否则用jQuery.multiFiler
      filter: function( selector ) {
        return this.pushStack(
        jQuery.isFunction( selector ) &&
          jQuery.grep(this, function(elem, i){
          return selector.call( elem, i );
        }) ||
          
          jQuery.multiFilter( selector, jQuery.grep(this, function(elem){
          return elem.nodeType === 1;
        }) ), "filter", selector );
      },
      //筛选最近的元素
      closest: function( selector ) {
        //判断是否用于方位的
        var pos = jQuery.expr.match.POS.test( selector ) ? jQuery(selector) : null,
        closer = 0;
        //把得到元素用map进行进一步的筛选
        return this.map(function(){
          var cur = this;
          while ( cur && cur.ownerDocument ) {
            if ( pos ? pos.index(cur) &gt; -1 : jQuery(cur).is(selector) ) {
              jQuery.data(cur, "closest", closer);
              return cur;
            }
            cur = cur.parentNode;
            closer++;
          }
        });
      },
      //用于反选,内部调用filter
      not: function( selector ) {
        if ( typeof selector === "string" )
        // test special case where just one selector is passed in
          if ( isSimple.test( selector ) )//如果单一的类
            return this.pushStack( jQuery.multiFilter( selector, this, true ), "not", selector );
        else
          selector = jQuery.multiFilter( selector, this );
        //处理NodeList
        var isArrayLike = selector.length && selector[selector.length - 1] !== undefined && !selector.nodeType;
        return this.filter(function() {//再回调用filter
          return isArrayLike ? jQuery.inArray( this, selector ) &lt; 0 : this != selector;
        });
      },
      //添加新元素,内部进行清零压栈等操作
      add: function( selector ) {
        return this.pushStack( jQuery.unique( jQuery.merge(
        this.get(),
        typeof selector === "string" ?
          jQuery( selector ) :
          jQuery.makeArray( selector )
      )));
      },
      //相当于javascript1.6 Array的some方法
      is: function( selector ) {
        return !!selector && jQuery.multiFilter( selector, this ).length &gt; 0;
      },
      //怎么这方法那么笨重?!
      hasClass: function( selector ) {
        return !!selector && this.is( "." + selector );
      },
      //基本上是用于获取元素value属性的值
      //对于下拉开框,则是其innerText
      //与css,attr一样,可读可写
      val: function( value ) {
        if ( value === undefined ) {			
          var elem = this[0];
          
          if ( elem ) {
            if( jQuery.nodeName( elem, 'option' ) )
              return (elem.attributes.value || {}).specified ? elem.value : elem.text;
            
            // We need to handle select boxes special
            if ( jQuery.nodeName( elem, "select" ) ) {
              var index = elem.selectedIndex,
              values = [],
              options = elem.options,
              one = elem.type == "select-one";
              
              // Nothing was selected
              if ( index &lt; 0 )
                return null;
              
              // Loop through all the selected options
              for ( var i = one ? index : 0, max = one ? index + 1 : options.length; i &lt; max; i++ ) {
                var option = options[ i ];
                
                if ( option.selected ) {
                  // Get the specifc value for the option
                  value = jQuery(option).val();
                  
                  // We don't need an array for one selects
                  if ( one )
                    return value;
                  
                  // Multi-Selects return an array
                  values.push( value );
                }
              }
              
              return values;				
            }
            
            // Everything else, we just grab the value
            return (elem.value || "").replace(/\r/g, "");
            
          }
          
          return undefined;
        }
        
        if ( typeof value === "number" )
          value += '';
        
        return this.each(function(){
          if ( this.nodeType != 1 )
            return;
          //处理radio的checkbox checked属性,用于返回true与false
          if ( jQuery.isArray(value) && /radio|checkbox/.test( this.type ) )
            this.checked = (jQuery.inArray(this.value, value) &gt;= 0 ||
            jQuery.inArray(this.name, value) &gt;= 0);
          
          else if ( jQuery.nodeName( this, "select" ) ) {
            var values = jQuery.makeArray(value);
            
            jQuery( "option", this ).each(function(){
              this.selected = (jQuery.inArray( this.value, values ) &gt;= 0 ||
                jQuery.inArray( this.text, values ) &gt;= 0);
            });
            
            if ( !values.length )
              this.selectedIndex = -1;
            
          } else
            this.value = value;
        });
      },
      //就是innerHTML
      html: function( value ) {
        return value === undefined ?
          (this[0] ?
          this[0].innerHTML.replace(/ jQuery\d+="(?:\d+|null)"/g, "") :
          null) :
          this.empty().append( value );
      },
      //与replaceNode差不多
      replaceWith: function( value ) {
        return this.after( value ).remove();
      },
      //把等于此索引值的DOM对象从jQuery对象中取出
      eq: function( i ) {
        return this.slice( i, +i + 1 );
      },
 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
完整版:https://download.csdn.net/download/qq_27595745/89522468 【课程大纲】 1-1 什么是java 1-2 认识java语言 1-3 java平台的体系结构 1-4 java SE环境安装和配置 2-1 java程序简介 2-2 计算机中的程序 2-3 java程序 2-4 java类库组织结构和文档 2-5 java虚拟机简介 2-6 java的垃圾回收器 2-7 java上机练习 3-1 java语言基础入门 3-2 数据的分类 3-3 标识符、关键字和常量 3-4 运算符 3-5 表达式 3-6 顺序结构和选择结构 3-7 循环语句 3-8 跳语句 3-9 MyEclipse工具介绍 3-10 java基础知识章节练习 4-1 一维数组 4-2 数组应用 4-3 多维数组 4-4 排序算法 4-5 增强for循环 4-6 数组和排序算法章节练习 5-0 抽象和封装 5-1 面向过程的设计思想 5-2 面向对象的设计思想 5-3 抽象 5-4 封装 5-5 属性 5-6 方法的定义 5-7 this关键字 5-8 javaBean 5-9 包 package 5-10 抽象和封装章节练习 6-0 继承和多态 6-1 继承 6-2 object类 6-3 多态 6-4 访问修饰符 6-5 static修饰符 6-6 final修饰符 6-7 abstract修饰符 6-8 接口 6-9 继承和多态 章节练习 7-1 面向对象的分析与设计简介 7-2 对象模型建立 7-3 类之间的关系 7-4 软件的可维护与复用设计原则 7-5 面向对象的设计与分析 章节练习 8-1 内部类与包装器 8-2 对象包装器 8-3 装箱和拆箱 8-4 练习题 9-1 常用类介绍 9-2 StringBuffer和String Builder类 9-3 Rintime类的使用 9-4 日期类简介 9-5 java程序国际化的实现 9-6 Random类和Math类 9-7 枚举 9-8 练习题 10-1 java异常处理 10-2 认识异常 10-3 使用try和catch捕获异常 10-4 使用throw和throws引发异常 10-5 finally关键字 10-6 getMessage和printStackTrace方法 10-7 异常分类 10-8 自定义异常类 10-9 练习题 11-1 Java集合框架和泛型机制 11-2 Collection接口 11-3 Set接口实现类 11-4 List接口实现类 11-5 Map接口 11-6 Collections类 11-7 泛型概述 11-8 练习题 12-1 多线程 12-2 线程的生命周期 12-3 线程的调度和优先级 12-4 线程的同步 12-5 集合类的同步问题 12-6 用Timer类调度任务 12-7 练习题 13-1 Java IO 13-2 Java IO原理 13-3 流类的结构 13-4 文件流 13-5 缓冲流 13-6 换流 13-7 数据流 13-8 打印流 13-9 对象流 13-10 随机存取文件流 13-11 zip文件流 13-12 练习题 14-1 图形用户界面设计 14-2 事件处理机制 14-3 AWT常用组件 14-4 swing简介 14-5 可视化开发swing组件 14-6 声音的播放和处理 14-7 2D图形的绘制 14-8 练习题 15-1 反射 15-2 使用Java反射机制 15-3 反射与动态代理 15-4 练习题 16-1 Java标注 16-2 JDK内置的基本标注类型 16-3 自定义标注类型 16-4 对标注进行标注 16-5 利用反射获取标注信息 16-6 练习题 17-1 顶目实战1-单机版五子棋游戏 17-2 总体设计 17-3 代码实现 17-4 程序的运行与发布 17-5 手动生成可执行JAR文件 17-6 练习题 18-1 Java数据库编程 18-2 JDBC类和接口 18-3 JDBC操作SQL 18-4 JDBC基本示例 18-5 JDBC应用示例 18-6 练习题 19-1 。。。
东南亚位于我国倡导推进的“一带一路”海陆交汇地带,作为当今全球发展最为迅速的地区之一,近年来区域内生产总值实现了显著且稳定的增长。根据东盟主要经济体公布的最新数据,印度尼西亚2023年国内生产总值(GDP)增长5.05%;越南2023年经济增长5.05%;马来西亚2023年经济增速为3.7%;泰国2023年经济增长1.9%;新加坡2023年经济增长1.1%;柬埔寨2023年经济增速预计为5.6%。 东盟国家在“一带一路”沿线国家中的总体GDP经济规模、贸易总额与国外直接投资均为最大,因此有着举足轻重的地位和作用。当前,东盟与中国已互相成为双方最大的交易伙伴。中国-东盟贸易总额已从2013年的443亿元增长至 2023年合计超逾6.4万亿元,占中国外贸总值的15.4%。在过去20余年中,东盟国家不断在全球多变的格局里面临挑战并寻求机遇。2023东盟国家主要经济体受到国内消费、国外投资、货币政策、旅游业复苏、和大宗商品出口价企稳等方面的提振,经济显现出稳步增长态势和强韧性的潜能。 本调研报告旨在深度挖掘东南亚市场的增长潜力与发展机会,分析东南亚市场竞争态势、销售模式、客户偏好、整体市场营商环境,为国内企业出海开展业务提供客观参考意见。 本文核心内容: 市场空间:全球行业市场空间、东南亚市场发展空间。 竞争态势:全球份额,东南亚市场企业份额。 销售模式:东南亚市场销售模式、本地代理商 客户情况:东南亚本地客户及偏好分析 营商环境:东南亚营商环境分析 本文纳入的企业包括国外及印尼本土企业,以及相关上下游企业等,部分名单 QYResearch是全球知名的大型咨询公司,行业涵盖各高科技行业产业链细分市场,横跨如半导体产业链(半导体设备及零部件、半导体材料、集成电路、制造、封测、分立器件、传感器、光电器件)、光伏产业链(设备、硅料/硅片、电池片、组件、辅料支架、逆变器、电站终端)、新能源汽车产业链(动力电池及材料、电驱电控、汽车半导体/电子、整车、充电桩)、通信产业链(通信系统设备、终端设备、电子元器件、射频前端、光模块、4G/5G/6G、宽带、IoT、数字经济、AI)、先进材料产业链(金属材料、高分子材料、陶瓷材料、纳米材料等)、机械制造产业链(数控机床、工程机械、电气机械、3C自动化、工业机器人、激光、工控、无人机)、食品药品、医疗器械、农业等。邮箱:market@qyresearch.com

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值