菜单
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON JAVA PHP HOW TO W3.CSS C C++ C# BOOTSTRAP REACT MYSQL JQUERY EXCEL XML DJANGO NUMPY PANDAS NODEJS R TYPESCRIPT ANGULAR GIT POSTGRESQL MONGODB ASP AI GO KOTLIN SASS VUE DSA GEN AI SCIPY AWS CYBERSECURITY DATA SCIENCE
     ❯   

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 服务用于教育机构、团队或企业,请发送电子邮件给我们
sales@w3schools.com

报告错误

如果您想报告错误,或想提出建议,请发送电子邮件给我们
help@w3schools.com

W3Schools 经过优化,旨在方便学习和培训。示例可能经过简化,以提高阅读和学习体验。教程、参考资料和示例会不断审查,以避免错误,但我们无法保证所有内容的完全正确性。使用 W3Schools 即表示您已阅读并接受我们的使用条款Cookie 和隐私政策

版权所有 1999-2024 Refsnes Data。保留所有权利。W3Schools 由 W3.CSS 提供支持