HTML DOM classList 屬性

定義和用法:

classList 屬性返回元素的類名,作為 DOMTokenList 對象衩匣。
該屬性用于在元素中添加矛辕,移除及切換 CSS 類。
classList 屬性是只讀的熬甚,但你可以使用 add() 和 remove() 方法修改它逢渔。

瀏覽器支持

表格中的數(shù)字表示支持該屬性的第一個瀏覽器的版本號。

屬性 谷歌 IE 火狐 歐朋
classList 8.0 10.0 3.6 5.1 11.5

語法:

element.classList

Properties:

屬性 Description
length 返回類列表中類的數(shù)量 該屬性是只讀的

方法:

方法 描述
add(class1, class2, ...) 在元素中添加一個或多個類名乡括。

如果指定的類名已存在肃廓,則不會添加
contains(class) 返回布爾值,判斷指定的類名是否存在诲泌。

可能值:true - 元素包已經(jīng)包含了該類名

false - 元素中不存在該類名
item(index) 返回類名在元素中的索引值盲赊。索引值從 0 開始。

如果索引值在區(qū)間范圍外則返回 null
remove(class1, class2, ...) 移除元素中一個或多個類名敷扫。

注意: 移除不存在的類名哀蘑,不會報錯。
toggle(class, true|false) 在元素中切換類名葵第。第一個參數(shù)為要在元素中移除的類名绘迁,并返回 false。

如果該類名不存在則會在元素中添加類名羹幸,并返回 true脊髓。

第二個是可選參數(shù),是個布爾值用于設(shè)置元素是否強(qiáng)制添加或移除類栅受,不管該類名是否存在。

例如:
移除一個 class:
element.classList.toggle("classToRemove", false);

添加一個 class:
element.classList.toggle("classToAdd", true);

注意: Internet Explorer 或 Opera 12 及其更早版本不支持第二個參數(shù)恭朗。

技術(shù)描述

返回值: 一個 DOMTokenList, 包含元素的類名列表

實例

菜鳥教程

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末屏镊,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子痰腮,更是在濱河造成了極大的恐慌而芥,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,858評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件膀值,死亡現(xiàn)場離奇詭異棍丐,居然都是意外死亡误辑,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,372評論 3 395
  • 文/潘曉璐 我一進(jìn)店門歌逢,熙熙樓的掌柜王于貴愁眉苦臉地迎上來巾钉,“玉大人,你說我怎么就攤上這事秘案∨椴裕” “怎么了?”我有些...
    開封第一講書人閱讀 165,282評論 0 356
  • 文/不壞的土叔 我叫張陵阱高,是天一觀的道長赚导。 經(jīng)常有香客問我,道長赤惊,這世上最難降的妖魔是什么吼旧? 我笑而不...
    開封第一講書人閱讀 58,842評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮未舟,結(jié)果婚禮上圈暗,老公的妹妹穿的比我還像新娘。我一直安慰自己处面,他們只是感情好厂置,可當(dāng)我...
    茶點故事閱讀 67,857評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著魂角,像睡著了一般昵济。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上野揪,一...
    開封第一講書人閱讀 51,679評論 1 305
  • 那天访忿,我揣著相機(jī)與錄音,去河邊找鬼斯稳。 笑死海铆,一個胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的挣惰。 我是一名探鬼主播卧斟,決...
    沈念sama閱讀 40,406評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼憎茂!你這毒婦竟也來了珍语?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,311評論 0 276
  • 序言:老撾萬榮一對情侶失蹤竖幔,失蹤者是張志新(化名)和其女友劉穎板乙,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體拳氢,經(jīng)...
    沈念sama閱讀 45,767評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡募逞,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,945評論 3 336
  • 正文 我和宋清朗相戀三年蛋铆,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片放接。...
    茶點故事閱讀 40,090評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡刺啦,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出透乾,到底是詐尸還是另有隱情洪燥,我是刑警寧澤,帶...
    沈念sama閱讀 35,785評論 5 346
  • 正文 年R本政府宣布乳乌,位于F島的核電站捧韵,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏汉操。R本人自食惡果不足惜再来,卻給世界環(huán)境...
    茶點故事閱讀 41,420評論 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望磷瘤。 院中可真熱鬧芒篷,春花似錦、人聲如沸采缚。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,988評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽扳抽。三九已至篡帕,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間贸呢,已是汗流浹背镰烧。 一陣腳步聲響...
    開封第一講書人閱讀 33,101評論 1 271
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留楞陷,地道東北人怔鳖。 一個月前我還...
    沈念sama閱讀 48,298評論 3 372
  • 正文 我出身青樓,卻偏偏與公主長得像固蛾,于是被迫代替她去往敵國和親结执。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,033評論 2 355

推薦閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案艾凯? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標(biāo)簽?zāi)J(rèn)的外補(bǔ)...
    _Yfling閱讀 13,754評論 1 92
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理昌犹,服務(wù)發(fā)現(xiàn),斷路器览芳,智...
    卡卡羅2017閱讀 134,659評論 18 139
  • Element對象對應(yīng)網(wǎng)頁的HTML標(biāo)簽元素。每一個HTML標(biāo)簽元素鸿竖,在DOM樹上都會轉(zhuǎn)化成一個Element節(jié)點...
    周花花啊閱讀 1,083評論 0 0
  • 當(dāng)我在很認(rèn)真的做一件事的時候,竟然會被說心思不在這件事上悟泵,不知道神游到哪里去了杈笔。 我是這樣的狀態(tài)嗎?給人夢游的感覺...
    70e05b1b737e閱讀 170評論 0 0
  • 1.爸在哪糕非,家在哪 “寶貝蒙具,周末有撒安排尼?”年近百半的爸爸跟孩子一樣俏皮地在電話那頭問我朽肥。 “回家呀禁筏。” “好衡招,...
    能量能量小太陽閱讀 210評論 0 1