Vixual / 123 posts / tags / 80 comments / feed / comments feed /
Search:

Javascript 模擬 jQuery 的選擇器(Selector)

JQuery 強大、方便的選擇器 (Selector) 是 jQuery 不可或缺的功能之一。不過如果我們不想載入 jQuery 而只想使用類似 jQuery 選擇器的功能,那可以用自訂函式的方式做到:

function $$(theElement){
    switch(theElement.charAt(0)){
    case ("#"):
        // 以 $$("#id") 傳回物件
        return (document.getElementById(theElement.replace(/^#/, "")));
    case ("."):
        // 以 $$(".class") 傳回物件陣列,IE 不支援
        return (document.getElementsByClassName(theElement.replace(/^\./, "")));
    default:
        // 以 $$("tag") 傳回物件陣列
        return (document.getElementsByTagName(theElement));
    }
}

或是簡單一點,僅傳回指定 id 的物件:

function $$(theElement){
    return(document.getElementById(theElement));
}

我把這自訂的函式取名為 $$(),用以與 jQuery 的 $() 做區隔。

但是要注意,以上兩個函式傳回的都是 DOM 物件,與 jQuery 在其它操作上並不相同。

收藏至網路書籤: These icons link to social bookmarking sites where readers can share and discover new web pages.
  • del.icio.us
  • Google
  • Live
  • YahooMyWeb
  • MyShare
  • Hemidemi
  • Funp

您可能會對以下這些文章感興趣

您對這篇文章的評價:
1 Star2 Stars3 Stars4 Stars5 Stars (有 2 人給予評價)
Loading ... Loading ...