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)