使用 JavaScript 检查 Body 是否有特定的类
使用 classList.contains() 方法检查 body 元素是否有特定的类，例如 document.body.classList.contains('my-class')。 该方法返回一个布尔值 - 如果元素的类列表包含该类，则返回 true，否则返回 false。
以下是本文示例的 HTML。
index.html<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> </head> <style> .bg-salmon { background-color: salmon; } </style> <body class="bg-salmon"> <div>Box 1</div> <script src="index.js"></script> </body> </html>
下面是JavaScript代码
index.jsconst bodyHasClass = document.body.classList.contains( 'bg-salmon' ); if (bodyHasClass) { console.log('✅ body element has class'); } else { console.log('⛔️ body element does not have class'); }
文档对象的 body 属性使我们能够访问 body 元素。
我们使用了 classList.contains 方法来检查 body 元素是否有一个特定的类。
如果提供的类包含在元素的类列表中，则该方法返回 true，否则返回 false。
如果需要在 body 元素中添加或删除类，可以使用 classList.add() 和 classList.remove() 方法。
// ✅ Add classes to <body> element
document.body.classList.add('first-class', 'second-class');
// ✅ Remove classes from <body> element
document.body.classList.remove('bg-salmon', 'third-class');
classList.add 方法向元素添加一个或多个类。
如果元素上已经存在任何提供的类，则不会再次添加这些类。
classList.remove 方法从元素中删除一个或多个类。
如果元素上不存在任何类，
remove()方法不会抛出错误，它只是忽略该类。
相关文章
使用 CSS 和 JavaScript 制作文本闪烁
发布时间：2023/04/28 浏览次数：146 分类：CSS
-
本文提供了使用 CSS、JavaScript 和 jQuery 使文本闪烁的详细说明。
在 PHP 变量中存储 Div Id 并将其传递给 JavaScript
发布时间：2023/03/29 浏览次数：69 分类：PHP
-
本文教导将 div id 存储在 PHP 变量中并将其传递给 JavaScript 代码。
在 JavaScript 中从字符串中获取第一个字符
发布时间：2023/03/24 浏览次数：93 分类：JavaScript
-
在本文中，我们将看到如何使用 JavaScript 中的内置方法获取字符串的第一个字符。
在 JavaScript 中获取字符串的最后一个字符
发布时间：2023/03/24 浏览次数：141 分类：JavaScript
-
本教程展示了在 javascript 中获取字符串最后一个字符的方法
