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 学习路径
跟踪您的进度 - 免费!