<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>换肤</title>
<style>
body { --color-fcfcfc: green;--color-fff:white;}
body[arco-theme='dark'] {--color-fcfcfc: black;--color-fff:red;}
.div-card{background-color: var(--color-fcfcfc);color:var(--color-fff)}
</style>
</head>
<body>
<div class="div-card">换肤</div>
<button type="button">换肤</button>
<br>
<script type="text/javascript">
window.onload = function() {
var dom = document.getElementsByTagName("button")[0]
dom.onclick = function() {
if (document.body.getAttribute("arco-theme") == 'dark') {
document.body.removeAttribute("arco-theme")
} else {
document.body.setAttribute('arco-theme', 'dark')
}
}
}
</script>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
