js判斷樣式className同時(shí)增加class或刪除class
更新時(shí)間:2013年01月30日 11:57:11 作者:
用正則表達(dá)式判斷多個(gè)class之間是否存在真正的class(前后空格的處理)然后增加class刪除class,本文給予實(shí)現(xiàn)方法,感興趣的朋友可以了解下,或許對(duì)你有所幫助
復(fù)制代碼 代碼如下:
function MyClass () {}
MyClass.hasClassName = function(element, className)
{
if (!element) return;
var elementClassName = element.className;
if (elementClassName.length == 0) return false;
//用正則表達(dá)式判斷多個(gè)class之間是否存在真正的class(前后空格的處理)
if (elementClassName == className || elementClassName.match(new RegExp("(^|\\s)" + className + "(\\s|$)")))
return true;
return false;
};
MyClass.addClassName = function(element, className)
{
if (!element) return;
var elementClassName = element.className;
if (elementClassName.length == 0)
{
element.className = elementClassName;
return;
}
if (elementClassName == className || elementClassName.match(new RegExp("(^|\\s)" + className + "(\\s|$)")))
return;
element.className = elementClassName + " " + className;
};
MyClass.removeClassName = function(element, className)
{
if (!element) return;
var elementClassName = element.className;
if (elementClassName.length == 0) return;
if(elementClassName == className)
{
element.className = "";
return;
}
if (elementClassName.match(new RegExp("(^|\\s)" + className + "(\\s|$)")))
element.className = elementClassName.replace((new RegExp("(^|\\s)" + className + "(\\s|$)"))," ");
};
您可能感興趣的文章:
- js中設(shè)置元素class的三種方法小結(jié)
- 用原生JS獲取CLASS對(duì)象(很簡(jiǎn)單實(shí)用)
- js獲取class的所有元素
- JavaScript更改class和id的方法
- js實(shí)現(xiàn)class樣式的修改、添加及刪除的方法
- 原生js實(shí)現(xiàn)addClass,removeClass,hasClass方法
- js獲取某元素的class里面的css屬性值代碼
- javaScript給元素添加多個(gè)class的簡(jiǎn)單實(shí)現(xiàn)
- vue.js入門教程之綁定class和style樣式
- 深入理解JavaScript和TypeScript中的class
相關(guān)文章
JavaScript第一篇之實(shí)現(xiàn)按鈕全選、功能
這篇文章主要介紹了JavaScript第一篇之實(shí)現(xiàn)按鈕全選、功能的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-08-08微信小程序?qū)崿F(xiàn)聯(lián)動(dòng)選擇器
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)聯(lián)動(dòng)選擇器,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-02-02如何利用JavaScript實(shí)現(xiàn)二叉搜索樹(shù)
這篇文章主要給大家介紹了關(guān)于如何利用JavaScript實(shí)現(xiàn)二叉搜索樹(shù)的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-04-04微信小程序里長(zhǎng)按識(shí)別二維碼的實(shí)現(xiàn)過(guò)程
這篇文章主要給大家介紹了關(guān)于微信小程序里長(zhǎng)按識(shí)別二維碼的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03微信小程序?qū)崿F(xiàn)走馬燈式抽獎(jiǎng)
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)走馬燈式抽獎(jiǎng),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-04-04Javascript實(shí)現(xiàn)視頻文件播放功能(示例詳解)
這篇文章主要介紹了Javascript實(shí)現(xiàn)視頻文件播放功能,使用CSS完成相應(yīng)的布局樣式,利用JavaScript函數(shù)來(lái)監(jiān)聽(tīng)進(jìn)度條,然后使用鼠標(biāo)點(diǎn)擊按鈕實(shí)現(xiàn)對(duì)視頻的播放,需要的朋友可以參考下2023-10-10