CSS和jQuery是网页开发中常用的工具。但有时，我们需要在网页中判断它们是否存在，以便灵活地控制网页的样式和行为。本篇文章介绍如何判断CSS和jQuery是否存在，并提供相关的代码示例。
一、判断CSS是否存在
在判断CSS是否存在之前，需要了解CSS的加载过程。一般来说，CSS是在HTML文档的
标签中通过标签引入的。例如：<head> <link rel="stylesheet" type="text/css" href="style.css"> </head>
上述代码中，我们通过标签引入了名为style.css的CSS文件。那么，如何判断这个CSS文件是否被加载了呢？
在JavaScript中，我们可以通过document.getElementsByTagName("link")方法获取
标签中的所有元素，然后循环遍历这些元素，判断它们的href属性是否等于我们要加载的CSS文件路径。如果等于，则说明CSS文件已经加载，否则CSS文件还未加载。示例代码如下：
function isCSSExist(url) {
var links = document.getElementsByTagName("link");
for (var i = 0; i < links.length; i++) {
if (links[i].href == url) {
return true;
}
}
return false;
}
// 判断style.css是否存在
if (isCSSExist("style.css")) {
console.log("style.css已加载");
} else {
console.log("style.css未加载");
}除了判断元素是否存在外，我们还可以通过判断CSS样式是否生效来判断CSS是否加载。具体做法是在HTML文档中添加一个测试元素，然后检查该元素的某个样式是否生效。示例代码如下：
HTML：
<html> <head> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <!-- 测试元素 --> <div id="test">测试</div> </body> </html>
CSS：
/* style.css */
#test {
color: red;
}JavaScript：
function isCSSExist() {
var test = document.createElement("div");
test.setAttribute("id", "test");
document.body.appendChild(test);
var color = window.getComputedStyle(test, null).getPropertyValue("color");
if (color == "rgb(255, 0, 0)") {
return true;
} else {
return false;
}
}
// 判断style.css是否存在
if (isCSSExist()) {
console.log("style.css已加载");
} else {
console.log("style.css未加载");
}上述代码中，我们创建了一个id为test的
二、判断jQuery是否存在
在判断jQuery是否存在之前，需要了解jQuery的加载过程。一般来说，我们在HTML文档的
标签中引入jQuery的JavaScript库。例如：<head> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head>
上述代码中，我们通过
