JSLite - 核心方法

如有疑問歡迎到這些地方交流，歡迎加入JSLite.io組織團(tuán)伙共同開發(fā)！

segmentfault社區(qū) | 官方網(wǎng)站 | 官方文檔-更詳細(xì) | Issues

$()

選擇器使用的是瀏覽器自帶的方法的 document.querySelectorAll 接口，支持標(biāo)準(zhǔn)的 CSS 選擇器，沒有使用jQuery作者John Resig開發(fā)的DOM選擇器引擎(Dom Selector Engine) Sizzle 。
目前 IE8/9及Firefox/Chrome/Safari/Opera 的最新版已經(jīng)支持 querySelectorAll 。



$(selector) //? 選擇節(jié)點(diǎn)

$("") //? 生成節(jié)點(diǎn)

$("htmlString") //? 生成

JSLite(function($){ ... }) //? 相當(dāng)于ready

$("#box") //? 返回節(jié)點(diǎn)數(shù)組  //? [<div>?…?</div>?]
$("<div></div>") //? 生成div節(jié)點(diǎn)
//JSLite(func) 相當(dāng)于ready
JSLite(function($){
    console.log("在節(jié)點(diǎn)加載完成之后執(zhí)行")
})
//$(func) 相當(dāng)于ready
$(function($){
    console.log("在節(jié)點(diǎn)加載完成之后執(zhí)行")
})

JSLite()

與$()相同。

noConflict

noConflict() 方法讓渡變量 $ 的 JSLite 控制權(quán)，解決倆庫(kù)之間的$沖突。
該方法釋放 JSLite 對(duì) $ 變量的控制。
該方法也可用于為 JSLite 變量規(guī)定新的自定義名稱。

常規(guī)

$.noConflict();
JSLite(document).ready(function($) {
// 使用 JSLite $ 的代碼
});
// 使用其他庫(kù)的 $ 的代碼

映射回原始的對(duì)象

將 $ 引用的對(duì)象映射回原始的對(duì)象：

JSLite.noConflict();
JSLite("div p").hide(); // 使用 JSLite
$("content").style.display = "none";    // 使用其他庫(kù)的 $()

恢復(fù)使用別名

恢復(fù)使用別名 $，然后創(chuàng)建并執(zhí)行一個(gè)函數(shù)，在這個(gè)函數(shù)的作用域中仍然將 $ 作為 JSLite 的別名來(lái)使用。在這個(gè)函數(shù)中，原來(lái)的 $ 對(duì)象是無(wú)效的。這個(gè)函數(shù)對(duì)于大多數(shù)不依賴于其他庫(kù)的插件都十分有效：

JSLite.noConflict();
(function($) { 
  $(function() {
    // 使用 $ 作為 JSLite 別名的代碼
  });
})(JSLite);


... // 其他用 $ 作為別名的庫(kù)的代碼

簡(jiǎn)寫

可以將 JSLite.noConflict() 與簡(jiǎn)寫的 ready 結(jié)合，使代碼更緊湊

JSLite.noConflict()(function(){
    // 使用 JSLite 的代碼
    console.log($("div"))
});

創(chuàng)建別名

創(chuàng)建一個(gè)新的別名用以在接下來(lái)的庫(kù)中使用 JSLite 對(duì)象：

var j = JSLite.noConflict();
j("#box").hide();  // 基于 JSLite 的代碼
$("content").style.display = "none";    // 基于其他庫(kù)的 $() 代碼

新的命名空間

完全將 JSLite 移到一個(gè)新的命名空間：

var dom = {};
dom.jslite = JSLite.noConflict(true);

結(jié)果:

dom.jslite("div p").hide();  // 新 JSLite 的代碼
$("content").style.display = "none";    // 另一個(gè)庫(kù) $() 的代碼
JSLite("div > p").hide();   // 另一個(gè)版本 JSLite 的代碼