欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Javascript封裝id、class與元素選擇器方法示例

 更新時間:2017年03月13日 11:03:16   作者:zengzeng91  
這篇文章主要給大家介紹了Javascript封裝id、class與元素選擇器的方法,文中給出了詳細的示例代碼,對大家的理解和學習具有一定的參考價值,需要的朋友們下面來一起看看吧。

由于各個瀏覽器都支持的選擇方法只有如下三種:

     1、document.getElementById()

     2、document.getElementsByName()

     3、document.getElementsByTagName()

所以在封裝選擇器的時候要考慮瀏覽器的兼容性。

示例代碼如下:

<script>//封裝id選擇器
  function $(selector){
    var c=selector.substring(0,1);//獲取第一個字符
    if(c=="#"){
      return document.getElementById(selector.substring(1,selector.length));//返回相應的元素
    }
  }
  
  
  //封裝class選擇器
  function $(selector){
    var className=selector.substring(1);//從索引為1的元素往后取
    //判斷瀏覽器是否支持getElementsByClassName
    if(document.getElementsByClassName){
      return document.getElementsByClassName(className)
      //document.querySelectorAll('.cls')兼容性有問題
    }else{
      //document.getElementsByTagName('*')+正則表達式
      //\s空白字符 ^開始 $結束
      var reg=new RegExp('^|\\s'+className+'$|\\s');
      var elems=document.getElementsByTagName("*");//獲取頁面中所有元素
      var arr=[];//保存獲取到的指定className的元素
      for(var i=0;i<elems.length;i++){
        if(reg.test(elems[i].className)){//如果和模式匹配上
          arr.push(elem[i]);
        }
      }
      return arr;
    }
  }
  
  //封裝標簽選擇器  
  function $(element){
    return document.getElementsByTagName(element);
  }
 </script>

總結

以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對大家的學習或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對腳本之家的支持。

您可能感興趣的文章:

相關文章

  • 微信小程序自定義膠囊樣式

    微信小程序自定義膠囊樣式

    這篇文章主要為大家詳細介紹了微信小程序自定義膠囊樣式,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2020-12-12
  • js實現(xiàn)簡單放大鏡特效

    js實現(xiàn)簡單放大鏡特效

    這篇文章主要為大家詳細介紹了js實現(xiàn)簡單放大鏡特效,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-03-03
  • javascript自啟動函數(shù)的問題探討

    javascript自啟動函數(shù)的問題探討

    自啟動函數(shù)想必大家并不陌生吧,在本文將為大家詳細探討下,感興趣的朋友可不要錯過
    2013-10-10
  • 微信小程序防止重復點擊按鈕的示例代碼

    微信小程序防止重復點擊按鈕的示例代碼

    這篇文章主要介紹了微信小程序防止重復點擊按鈕的示例代碼,本文通過示例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下
    2023-10-10
  • bootstrap table分頁模板和獲取表中的ID方法

    bootstrap table分頁模板和獲取表中的ID方法

    這篇文章主要介紹了bootstrap table分頁模板和獲取表中的ID方法,需要的朋友可以參考下
    2017-01-01
  • Javascript表格翻頁效果實現(xiàn)思路及代碼

    Javascript表格翻頁效果實現(xiàn)思路及代碼

    表格翻頁的實現(xiàn)方式有很多,下面以js為例為大家詳細介紹下表格翻頁效果的具體實現(xiàn),感興趣的朋友可以參考下
    2013-08-08
  • JS如何實現(xiàn)基于websocket的多端橋接平臺

    JS如何實現(xiàn)基于websocket的多端橋接平臺

    我們在調(diào)試過程使用的工具有:modheader,postman等,但這些工具都會存在的問題:缺少客戶端里相應的設備信息;即使將cookie信息復制出來,也是存在過期的問題;多個設備之間切換時不方便;針對這些存在的問題,我基于websocket雙向通信的特點,實現(xiàn)了多端橋接管理平臺
    2021-05-05
  • JS 事件延遲執(zhí)行說明分析

    JS 事件延遲執(zhí)行說明分析

    為了避免用戶鼠標無意識劃過,而觸發(fā)事件。浪費客戶端資源。
    2010-05-05
  • js實現(xiàn)炫酷的煙花效果

    js實現(xiàn)炫酷的煙花效果

    這篇文章主要為大家詳細介紹了js實現(xiàn)炫酷的煙花效果,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2021-09-09
  • js實現(xiàn)動態(tài)添加上傳文件頁面

    js實現(xiàn)動態(tài)添加上傳文件頁面

    這篇文章主要為大家詳細介紹了js實現(xiàn)動態(tài)添加上傳文件頁面,如何動態(tài)創(chuàng)建一個input標簽示例,具有一定的參考價值,感興趣的小伙伴們可以參考一下
    2018-10-10

最新評論