2013
Mar
09

YUI3 Instance

一開始使用 YUI ,除了要先載入 yui-min.js 這支 JS 之外,還要建立 YUI Instance 這個物件,建立方式 「YUI()」,執行這個 function 會建立一個獨立的 context scope,每個 YUI Instance 中的變數,是不能相互溝通的。

YUI3 Config

YUI3 的 Config 設定,可以用來修改 YUI 的預設行為。

Sample
  1. YUI({configKey: value}).use( function (){});
  • combine & comboBase

combine 預設為 true ,也就是 YUI 預設去抓 multi JS module 時,會使用 combo 的功能,將多個 JS 合併後,再一次抓回來,如果不想要這個功能,可以指定為 false。

comboBase 則是指定 combo 功能的路徑 ,例如我可以自已寫一個 combo.php, 然後再指定 comboBase 到我的 combo.php 。

  • delayUtil

delayUtil 主要功能是指定 YUI Instance 程式執行的時間,平常 YUI().use(function (){}); 中 function 是會直接就執行的,但有時我們會希望他可以等到 dom ready 之後再執行,這樣 delayUtil 就可以派上用場了,輸入值「 domready 」就搞定了。

  • fetchCSS

YUI 的 JS Module 中有一些會包含 css style,而且這些 css style 是存在一個 css file 裡,當你 include 了這個 JS Module,他的 CSS 就會自動被 YUI 抓回來,這樣就有可能會破壞我們自訂的 style ,所以你可以指定其值為 false,禁止 YUI 去抓 CSS Style。

另外還有一個值為 force ,這是指說就算 JS Module 已經存在,也要強迫 YUI 去重新抓一次 CSS Style 來取代現有的 Style 。

  • filter

取代預設的 JS Module 路徑,例如範例中,取代成 debug 模式,或是取代成未壓縮模式。

Example
  1. filter: {
  2. searchExp : "-min\\.js",
  3. replaceStr: "-debug.js"
  4. }
  5. or
  6. filter: {
  7. searchExp : "-min\\.js",
  8. replaceStr: ".js"
  9. }

回應 (Leave a comment)