在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ HTML/ 建造者模式
中介者模式
MVVM
亨元模式
設(shè)計(jì)模式分類概覽表
ES Harmony
組合模式
CommonJS
jQuery 插件的設(shè)計(jì)模式
外觀模式
觀察者模式
建造者模式
構(gòu)造器模式
外觀模式
簡(jiǎn)介
AMD
原型模式
設(shè)計(jì)模式的分類
觀察者模式
命名空間模式
代理模式
編寫(xiě)設(shè)計(jì)模式
適配器模式
反模式
什么是設(shè)計(jì)模式
模塊化模式
MVC
Mixin 模式
裝飾模式
設(shè)計(jì)模式的結(jié)構(gòu)
單例模式
迭代器模式
命令模式
工廠模式
MVP
暴露模塊模式
惰性初始模式

建造者模式

處理DOM時(shí),我們常常想要去動(dòng)態(tài)的構(gòu)建新的元素--這是一個(gè)會(huì)讓我們希望構(gòu)建的元素最終所包含的標(biāo)簽,屬性和參數(shù)的復(fù)雜性有所增長(zhǎng)的過(guò)程。

定義復(fù)雜的元素時(shí)需要特別的小心,特別是如果我們想要在我們?cè)貥?biāo)簽的字面意義上(這可能會(huì)亂成一團(tuán))擁有足夠的靈活性,或者取而代之去獲得更多面向?qū)ο舐肪€的可讀性。我們需要一種為我們構(gòu)建復(fù)雜DOM對(duì)象的機(jī)制,它獨(dú)立于為我們提供這種靈活性的對(duì)象本身,而這正是建造者模式為我們所提供的。

建造器使得我們僅僅只通過(guò)定義對(duì)象的類型和內(nèi)容,就可以去構(gòu)建復(fù)雜的對(duì)象,為我們屏蔽了明確創(chuàng)造或者展現(xiàn)對(duì)象的過(guò)程。

jQuery的美元標(biāo)記為動(dòng)態(tài)構(gòu)建新的jQuery(和DOM)對(duì)象提供了大量可以讓我們這樣做的不同的方法,可以通過(guò)給一個(gè)元素傳入完整的標(biāo)簽,也可以是部分標(biāo)簽還有內(nèi)容,或者使用jQuery來(lái)進(jìn)行構(gòu)造:

$( '<div class="foo">bar</div>' );

$( '<p id="test">foo <em>bar</em></p>').appendTo("body");

var newParagraph = $( "<p />" ).text( "Hello world" );

$( "<input />" )
      .attr({ "type": "text", "id":"sample"});
      .appendTo("#container");

下面引用自jQuery內(nèi)部核心的jQuery.protoype方法,它支持從jQuery對(duì)象到傳入jQuery()選擇器的標(biāo)簽的構(gòu)造。不管是不是使用document.createElement去創(chuàng)建一個(gè)新的元素,都會(huì)有一個(gè)針對(duì)這個(gè)元素的引用(找到或者被創(chuàng)建)被注入到返回的對(duì)象中,因此進(jìn)一步會(huì)有更多的諸如as.attr()的方法在這之后就可以很容易的在其上使用了。

// HANDLE: $(html) -> $(array)
  if ( match[1] ) {
    context = context instanceof jQuery ? context[0] : context;
    doc = ( context ? context.ownerDocument || context : document );

    // If a single string is passed in and it's a single tag
    // just do a createElement and skip the rest
    ret = rsingleTag.exec( selector );

    if ( ret ) {
      if ( jQuery.isPlainObject( context ) ) {
        selector = [ document.createElement( ret[1] ) ];
        jQuery.fn.attr.call( selector, context, true );

      } else {
        selector = [ doc.createElement( ret[1] ) ];
      }

    } else {
      ret = jQuery.buildFragment( [ match[1] ], [ doc ] );
      selector = ( ret.cacheable ? jQuery.clone(ret.fragment) : ret.fragment ).childNodes;
    }

    return jQuery.merge( this, selector );
上一篇:模塊化模式下一篇:組合模式