JavaScript 仅部分替换 CSS 文件
我试图通过使用事件侦听器在白天/夜间主题之间切换,将页面上的 CSS 文件替换为另一个 CSS 文件。我尝试了多种方法,但没有一种能完全奏效。
我的默认主题是深色的,我只能使用我的代码将其更改为浅色主题,而不能再次更改为深色。我究竟做错了什么?非常感谢大家!
1 2 3 4 5 6 7 | colorModeBtn.addEventListener( "click" , function () {
if (cssFile.href = "styles.css" ) {
cssFile.setAttribute( "href" , "styles-daylight.css" )
} else {
cssFile.setAttribute( "href" , "styles.css" )
}
})
|
1 2 3 4 5 6 7 8 9 | colorModeBtn.addEventListener( "click" , function () {
if (cssFileDay.disabled = true) {
cssFileDay.disabled = false
cssFile.disabled = true
} else {
cssFileDay.disabled = true
cssFile.disabled = false
}
})
|
1 2 3 4 5 6 7 8 9 10 11 12 | colorModeBtn.addEventListener( "click" , function () {
const cssLink = document.createElement( "link" )
if (cssFile.href = "styles.css" ) {
cssLink.rel = "stylesheet"
cssLink.href = "styles-daylight.css"
document.head.appendChild(cssLink)
cssFile.disabled = true
} else if (document.head.cssLink) {
document.head.removeChild(cssLink)
cssFile.disabled = false
}
})
|
1 2 3 4 5 6 7 8 9 10 11 12 13 | colorModeBtn.addEventListener( "click" , function () {
const cssLink = document.createElement( "link" )
if (cssFile.href = "styles.css" ) {
cssLink.rel = "stylesheet"
cssLink.href = "styles-daylight.css"
document.head.appendChild(cssLink)
cssFile.disabled = true
} else if (document.head.cssLink) {
var linkNode = document.querySelector( 'link[href*="styles-daylight.css"]' )
linkNode.removeChild(linkNode)
cssFile.disabled = false
}
})
|