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的< ;div>元素，並將其新增至HTML文件中。然後，利用getComputedStyle()方法取得該元素的color樣式，如果顏色值等於紅色的RGB值(255,0,0)，則表示CSS已經生效。
二、判斷jQuery是否存在
在判斷jQuery是否存在之前，需要先了解jQuery的載入過程。一般來說，我們在HTML文件的
標籤中引入jQuery的JavaScript庫。例如：<head> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head>
在上述程式碼中，我們透過
