添加一個類:
w3.addClass(selector,'class')
添加多個類:
w3.addClass(selector,'class1 class2 class3...')
根據(jù)Id添加類
將“marked”類添加到id=“London”的元素中:
實例
<button onclick="w3.addClass('#London','marked')">Add Class</button>
嘗試一下 ?
添加上CSS ?
根據(jù)標(biāo)簽添加類
在所有<h2>
元素中添加“marked”
類:
實例
<button onclick="w3.addClass('h2','marked')">Add Class</button>
嘗試一下 ?
添加上CSS ?
根據(jù)類添加類
用 class="city"
將 "marked"
類添加到元素中:
實例
<button onclick="w3.addClass('.city','marked')">Add Class</button>
嘗試一下 ?
添加上CSS ?
添加多個類
若要向一個元素添加多個類,請用空格分隔每個類。
將"class1"
和"class2"
添加到id="London"
的元素:
實例
<button onclick="w3.addClass('#London','class1 class2')">Add Classes</button>
嘗試一下 ?
添加上CSS ?
從HTML元素中刪除類
刪除一個類:
w3.removeClass(selector,'class')
刪除多個類:
w3.removeClass(selector,'class1 class2 class3...')
根據(jù)Id刪除類
從id="London"
的元素中刪除"marked"
類:
實例
<button onclick="w3.removeClass('#London','marked')">Remove Class</button>
嘗試一下 ?
添加上CSS ?
根據(jù)標(biāo)簽刪除類
從所有<h2>
元素中刪除“marked”
類:
實例
<button onclick="w3.removeClass('h2','marked')">Remove Class</button>
嘗試一下 ?
添加上CSS ?
根據(jù)類刪除類
用class="city"
刪除所有元素中的"marked"
類:
實例
<button onclick="w3.removeClass('.city','marked')">Remove Class</button>
嘗試一下 ?
添加上CSS ?
?刪除多個類?
若要從一個元素中刪除多個類,請用空格分隔每個類。
從id="London"
的元素中刪除"class1"
和"class2"
:
實例
<button onclick="w3.removeClass('#London','class1 class2')">Remove Classes</button>
嘗試一下 ?
添加上CSS ?
切換HTML元素的類
切換一個類(打開/關(guān)閉):
w3.toggleClass(selector,'class')
在兩個類之間切換:
w3.toggleClass(selector,'property','class','class')
根據(jù)Id切換類
在id="London"
的元素的"marked"
類之間切換:
實例
<button onclick="w3.toggleClass('#London','marked')">Toggle</button>
嘗試一下 ?
添加上CSS ?
根據(jù)標(biāo)簽切換類
在所有<h2>
元素的“marked”
類之間切換:
實例
<button onclick="w3.toggleClass('h2','marked')">Toggle</button>
嘗試一下 ?
添加上CSS?
根據(jù)類切換
在所有元素的“標(biāo)記”類之間切換class=“city”
:
實例
<button onclick="w3.toggleClass('.city','marked')">Toggle</button>
嘗試一下 ?
添加上CSS?
切換多個類
在id="London "的類名"class1"和"class2"之間切換:
實例
<button onclick="w3.toggleClass('#London','class1','class2')">Toggle</button>
嘗試一下 ?
添加上CSS ?
更多建議: