Javascript 檢測、添加、移除樣式(className)函數(shù)代碼
更新時(shí)間：2009年09月08日 18:30:44 作者：
在前臺(tái)腳本中，我們經(jīng)常要操作頁面元素的樣式，比如標(biāo)簽頁切換時(shí)，將當(dāng)前標(biāo)簽加上一個(gè)樣式，當(dāng)切換到其他標(biāo)簽時(shí)，再將樣式還原，本文介紹的是直接添加和移除 className 的方法。
復(fù)制代碼 代碼如下:
<script type="text/javascript">
// 說明：添加、移除、檢測 className
function hasClass(element, className) {
var reg = new RegExp('(\\s|^)'+className+'(\\s|$)');
return element.className.match(reg);
}
function addClass(element, className) {
if (!this.hasClass(element, className))
{
element.className += " "+className;
}
}
function removeClass(element, className) {
if (hasClass(element, className)) {
var reg = new RegExp('(\\s|^)'+className+'(\\s|$)');
element.className = element.className.replace(reg,' ');
}
}
</script>
您可能感興趣的文章:
- 詳解用JS添加和刪除class類名
- 基于JavaScript實(shí)現(xiàn)類名的添加與移除
- 向JavaScript的數(shù)組中添加元素的方法小結(jié)
- 原生js實(shí)現(xiàn)查找/添加/刪除/指定元素的class
- javaScript給元素添加多個(gè)class的簡單實(shí)現(xiàn)
- JavaScript DOM元素常見操作詳解【添加、刪除、修改等】
- js實(shí)現(xiàn)class樣式的修改、添加及刪除的方法
- JS添加或修改控件的樣式(Class)實(shí)現(xiàn)方法
- 原生js實(shí)現(xiàn)class的添加和刪除簡單代碼
- 原生js封裝添加class,刪除class的實(shí)例
- 原生js添加一個(gè)或多個(gè)類名的方法分析
相關(guān)文章
AngularJS+Bootstrap實(shí)現(xiàn)多文件上傳與管理
這篇文章主要為大家詳細(xì)介紹了AngularJS+Bootstrap實(shí)現(xiàn)多文件上傳與管理，對上傳文件進(jìn)行加載與刪除操作,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-11-11
用JS實(shí)現(xiàn)的radio圖片選擇按鈕效果2010-01-01
使用weixin-java-miniapp配置進(jìn)行單個(gè)小程序的配置詳解
這篇文章主要介紹了使用weixin-java-miniapp配置進(jìn)行單個(gè)小程序的配置詳解，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-03-03
這篇文章主要為大家詳細(xì)介紹了微信小程序自定義可滾動(dòng)的彈出框，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
允許網(wǎng)頁寬度自動(dòng)調(diào)整的"自適應(yīng)網(wǎng)頁設(shè)計(jì)"到底是怎么做到的？下面我們就來通過示例來探討下。2015-06-06
JavaScript中值類型與引用類型說明，需要的朋友可以參考下。2010-12-12
JS實(shí)現(xiàn)獲取來自百度,Google,soso,sogou關(guān)鍵詞的方法
這篇文章主要介紹了JS實(shí)現(xiàn)獲取來自百度,Google,soso,sogou關(guān)鍵詞的方法,結(jié)合實(shí)例形式分析了js獲取來路頁面的方法與相關(guān)搜索引擎關(guān)鍵詞的處理技巧,需要的朋友可以參考下2016-12-12
下面小編就為大家?guī)硪黄斦刯s模塊化規(guī)范。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07
滾動(dòng)條想必大家都見過吧，在本文將使用div來模擬滾動(dòng)條的效果，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下2013-10-10
這篇文章主要介紹了JavaScript中變量提升和函數(shù)提升的詳解，文章通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-08-08