W3.JS 為 HTML 新增類
新增一個類
w3.addClass(選擇器,'類名')
新增多個類
w3.addClass(選擇器,'類名1 類名2 類名3...')
透過 ID 新增類
為 ID 為 "London" 的元素新增 "marked" 類
示例
<button onclick="w3.addClass('#London','marked')">新增類</button>
親自嘗試 » 配合 CSS »
透過標籤名新增類
為所有 <h2> 元素新增 "marked" 類
示例
<button onclick="w3.addClass('h2','marked')">新增類</button>
親自嘗試 » 配合 CSS »
透過類名新增類
為 class="city" 的元素新增 "marked" 類
示例
<button onclick="w3.addClass('.city','marked')">新增類</button>
親自嘗試 » 配合 CSS »
新增多個類
要向元素新增多個類，請用空格分隔每個類。
為 ID 為 "London" 的元素同時新增 "class1" 和 "class2"
示例
<button onclick="w3.addClass('#London','class1 class2')">新增類</button>
親自嘗試 » 配合 CSS »
從 HTML 元素中移除類
移除一個類
w3.removeClass(選擇器,'類名')
移除多個類
w3.removeClass(選擇器,'類名1 類名2 類名3...')
透過 ID 移除類
從 ID 為 "London" 的元素中移除 "marked" 類
示例
<button onclick="w3.removeClass('#London','marked')">移除類</button>
親自嘗試 » 配合 CSS »
透過標籤名移除類
從所有 <h2> 元素中移除 "marked" 類
示例
<button onclick="w3.removeClass('h2','marked')">移除類</button>
親自嘗試 » 配合 CSS »
透過類名移除類
從所有 class="city" 的元素中移除 "marked" 類
示例
<button onclick="w3.removeClass('.city','marked')">移除類</button>
親自嘗試 » 配合 CSS »
移除多個類
要從元素中移除多個類，請用空格分隔每個類。
從 ID 為 "London" 的元素中同時移除 "class1" 和 "class2"
示例
<button onclick="w3.removeClass('#London','class1 class2')">移除類</button>
親自嘗試 » 配合 CSS »
切換 HTML 元素的類
切換一個類（開啟/關閉）
w3.toggleClass(選擇器,'類名')
在兩個類之間切換
w3.toggleClass(選擇器,'屬性','類名','類名')
透過 ID 切換類
切換 ID 為 "London" 的元素 "marked" 類
示例
<button onclick="w3.toggleClass('#London','marked')">切換</button>
親自嘗試 » 配合 CSS »
透過標籤名切換類
切換所有 <h2> 元素 "marked" 類
示例
<button onclick="w3.toggleClass('h2','marked')">切換</button>
親自嘗試 » 配合 CSS »
透過類名切換類
切換所有 class="city" 的元素 "marked" 類
示例
<button onclick="w3.toggleClass('.city','marked')">切換</button>
親自嘗試 » 配合 CSS »
切換多個類
切換 ID 為 "London" 的元素的 "class1" 和 "class2" 類
示例
<button onclick="w3.toggleClass('#London','class1','class2')">切換</button>
親自嘗試 » 配合 CSS »
W3schools 學習路徑
跟蹤您的進度 - 免費！
