javascript之a(chǎn)ddClass思路

我們需要來(lái)寫(xiě) addClass 方法 , 在添加class的時(shí)候,需要判斷是否已經(jīng)存在 ,如果沒(méi)有存在即添加。
所以我們準(zhǔn)備兩個(gè)方法, 一個(gè)是addClass, 另一個(gè)則是 hasClass ;

首先是hasClass方法 :

function hasClass(ele , className){
 /*通過(guò)正則表達(dá)式來(lái)判斷*/
   let reg= new RegExp("(^|\\s)"+className+"(\\s|$)");
   return reg.test(ele.className);
}

當(dāng)我們準(zhǔn)備好hasClass方法后,就可以來(lái)寫(xiě)addClass了。如下:

 function addClass(ele,className){
 if(!hasClass(ele,className)){
    /*先轉(zhuǎn)化為數(shù)組*/
     var newClassArray  =  ele.className.split(" ");
    /*往數(shù)組中添加新的class*/
     newClassArray.push(className);
    /*將數(shù)組轉(zhuǎn)化為string , 再進(jìn)行賦值操作*/
     ele.className = newClassArray.join(" ");
}
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Spring Cloud為開(kāi)發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見(jiàn)模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,544評(píng)論 19 139
  • 轉(zhuǎn)至元數(shù)據(jù)結(jié)尾創(chuàng)建: 董瀟偉,最新修改于: 十二月 23, 2016 轉(zhuǎn)至元數(shù)據(jù)起始第一章:isa和Class一....
    40c0490e5268閱讀 2,041評(píng)論 0 9
  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 178,962評(píng)論 25 709
  • MARCH 16, 2017GOLDEN PORTRAIT"At the bend of an alley, I ...
    試遣愚衷閱讀 217評(píng)論 0 0
  • 以前總聽(tīng)說(shuō)現(xiàn)在的大學(xué)生真多,幾乎滿(mǎn)地爬,拿塊磚頭隨便一扔就能砸到一個(gè),我自己也去了很多校園招聘會(huì),確實(shí)人滿(mǎn)為患,摩...
    我的夢(mèng)想就是不上班閱讀 205評(píng)論 0 1

友情鏈接更多精彩內(nèi)容