YUI學習筆記 YUI Loader

2021-05-24 07:11:10 字數 1353 閱讀 1466

說明:英文好的請直接猛擊這裡 ,本文沒什麼新東西。

yui中有很多核心元件,比如像dom, event,幾乎每個應用都會用到,但是我覺得在學習這些元件之前,最好先了解一下yui loader 這個好東西。yui loader 也是乙個 yui 的元件,它的作用就是通過指令碼載入頁面中需要用到的yui 元件,說白了,就是在頁面載入的時候,動態地在頁面中插入

如果你決定使用 yui loader 元件的話,就不用單獨引入yahoo全域性物件的js檔案了,因為yui loader 本身就包含了yahoo全域性物件。

下面介紹一下yui loader元件中的一些主要引數和方法:

方法:insert() 方法:最經常用的乙個方法,在配置好yui loader之後,使用這個方法把yui元件動態載入進來。

sandbox() 方法:有時候動態載入進來的元件可能會和現有的元件有衝突,這個時候就可以使用sandbox() 方法安全地載入元件。該方法通過yui connection manager 來獲取元件,並且在乙個匿名函式中執行。所以,這個方法只能夠載入同乙個域下的js。

addmodule() 方法:用來新增自定義的元件,有以下主要引數(具體看這裡 ):

name: 元件的名字,必須是獨一無二的,而且不能與yui自帶的元件衝突。

type: 元件型別。js 或者 css

path: 元件的路徑,一般都是相對於 yui loader中的 base 的相對路徑。

fullpath: 元件的完整路徑。

requires: 所依賴的yui元件

引數(全部引數介紹請看這裡 ):

require:陣列,包含了要載入的元件的模組名。

base:載入元件的預設路徑,載入元件的時候yui loader會先去這裡找。相當於系統變數裡的path。

onsuccess:函式,載入成功的時候呼叫。

onfailure:函式,載入失敗的時候呼叫。

varname:如果你載入的是自定義的元件,當元件載入完畢的時候這個變數就會變成可用的。

最後說一下yui模組名稱,說白了,就是yui元件在 yui loader中對應的縮略名,這樣就方便了載入,比如,你只需要在require 裡加上 「dom」 就可以yui中的dom元件。全部對應關係請看這裡

另外,附送一篇yui blog上關於使用 yui loader 減少載入檔案大小的分析:

loading yui: seeds, core, and combo-handling

YUI學習筆記1

用js做了幾個專案,感覺水平還是不夠,決定重新學習乙個js框架,好好研究下js。框架選擇了yui,先從翻譯yui.js做起吧,正好也提公升下英語水平。yui.js yui 3.8.1 yui模組包含建立yui種子檔案的部件。這裡包括指令碼載入機制 乙個簡單的佇列 程式庫的核心工具包。if typeo...

YUI 3 學習筆記 queue base

今天 yui 3 發布了 beta 1,實在是高興。繼續學習原始碼 queue base.一點心得 yui3 beta1 的 yui seed,與pr1 的架構圖 已經有了稍許不同 增加了 queue base 模組。queue base 的原始碼非常簡單,就是乙個包裝後的陣列。封裝後的介面非常有 ...

YUI3 core閱讀筆記

node debug.js node 為 htmlelement包裝 處理了快取 關鍵 addmethod importmethod 將 y.dom 中的靜態方法 yui2模型 遷移到 node例項中去.y.dom.method node,args node.method args nodelist...