学习使用js和jquery修改css路径，实现html页面主题切换功能
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>主题切换示例</title>
<link id="theme-link" rel="stylesheet" href="default.css">
</head>
<body>
<button id="theme-toggle">切换主题</button>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
$('#theme-toggle').click(function() {
var currentTheme = $('#theme-link').attr('href');
var themeToSwitch = (currentTheme === 'default.css') ? 'dark.css' : 'default.css';
$('#theme-link').attr('href', themeToSwitch);
});
});
</script>
</body>
</html>在这个例子中，我们有一个按钮和一个链接元素，链接元素指向当前使用的CSS样式表。页面加载完成后，我们绑定点击事件到按钮上，当按钮被点击时，会检查当前的CSS样式表，并根据需要切换到另一个样式表。这个功能可以通过jQuery库来简化DOM操作。
评论已关闭