JavaScript hanya menggantikan sebahagian fail CSS

Question

Saya cuba menggantikan fail CSS pada halaman dengan fail CSS lain dengan menggunakan pendengar acara untuk bertukar antara tema siang/malam. Saya mencuba pelbagai kaedah tetapi tiada satu pun yang berkesan.

Tema lalai saya ialah gelap dan saya hanya boleh menukarnya kepada tema terang menggunakan kod saya tetapi tidak sekali lagi kepada gelap. Apa yang saya buat salah? Terima kasih semua!

colorModeBtn.addEventListener("click", function() {
  if (cssFile.href = "styles.css") {
      cssFile.setAttribute("href", "styles-daylight.css") 
  } else {
    cssFile.setAttribute("href", "styles.css")
  }
})

colorModeBtn.addEventListener("click", function() {
  if (cssFileDay.disabled = true) {
    cssFileDay.disabled = false
    cssFile.disabled = true
  } else {
    cssFileDay.disabled = true
    cssFile.disabled = false
  }
})

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
  }
})

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
  }
})

Answer 1

Saya dah jumpa jawapannya cuma perkara kecil macam kes ni. Walau bagaimanapun, saya tidak faham mengapa ia tidak berfungsi seperti yang saya siarkan di atas.

Itulah yang saya gunakan.

colorModeBtn.addEventListener("click", function() {
  if (cssFileDay.disabled = true) {
    cssFileDay.disabled = false
    cssFile.disabled = true
  } else {
    cssFileDay.disabled = true
    cssFile.disabled = false
  }
})

Saya terpaksa menukar (cssFileDay.disabled = true) kepada (cssFileDay.disabled === true) atau (cssFileDay.disabled). Ia mula berfungsi dengan baik.

Answer 2

Bertahan di sana. Ya, anda menemui ralat itu. Tetapi keempat-empat kod contoh yang anda tunjukkan dalam soalan anda mempunyai if pernyataan seperti

if (x = true)

Satu = ialah perintah atribusi yang, dalam JavaScript (dan bahasa terbitan C lain), mengembalikan nilai, jadi pernyataan = 是一个归因命令，在 JavaScript（和其他 C 派生语言）中，它返回一个值，因此 if akan sentiasa benar.

Perbandingan yang anda mahukan ialah tanda sama besar berganda (==).

Tanda

triple equal (===) juga merupakan perbandingan, tetapi ia juga membandingkan jenis data di sebelah kiri dan kanan.