';' 預期的。 | document.body.style.background-image = ``

Question

這是我的代碼：代碼

 function toggle() {
     document.body.style.background-image = `
     linear-gradient(
      60deg,
      hsl(0deg 0% 0%) 0%,
      hsl(137deg 0% 1%) 0%,
      hsl(137deg 0% 2%) 0%,
      hsl(137deg 0% 4%) 2%,
      hsl(137deg 0% 5%) 5%,
      hsl(137deg 0% 5%) 10%,
      hsl(137deg 0% 6%) 19%,
      hsl(137deg 0% 6%) 42%,
      hsl(261deg 17% 14%) 88%,
      hsl(259deg 25% 27%) 97%,
      hsl(258deg 28% 40%) 100%,
      hsl(258deg 36% 54%) 100%
    );`;
  }

我在第 43 行收到一個錯誤說

';' 預期的。

我不知道為什么，我懷疑它是反引號的問題。 任何幫助將不勝感激。

Answer 1

它的背景圖像，而不是背景圖像

function toggle() {
    document.body.style.backgroundImage = `
    linear-gradient(
      60deg,
      hsl(0deg 0% 0%) 0%,
      hsl(137deg 0% 1%) 0%,
      hsl(137deg 0% 2%) 0%,
      hsl(137deg 0% 4%) 2%,
      hsl(137deg 0% 5%) 5%,
      hsl(137deg 0% 5%) 10%,
      hsl(137deg 0% 6%) 19%,
      hsl(137deg 0% 6%) 42%,
      hsl(261deg 17% 14%) 88%,
      hsl(259deg 25% 27%) 97%,
      hsl(258deg 28% 40%) 100%,
      hsl(258deg 36% 54%) 100%
    )
    `;
  }

Answer 2

當我們 select 任何 css JS 中的雙字屬性，如 max-height、margin-left 等時，我們刪除“-”並將第二個單詞的第一個字母大寫，如 maxHeight 或 marginLeft。 這樣做將是背景圖像。

 document.body.style.backgroundImage = ` linear-gradient( 60deg, hsl(0deg 0% 0%) 0%, hsl(137deg 0% 1%) 0%, hsl(137deg 0% 2%) 0%, hsl(137deg 0% 4%) 2%, hsl(137deg 0% 5%) 5%, hsl(137deg 0% 5%) 10%, hsl(137deg 0% 6%) 19%, hsl(137deg 0% 6%) 42%, hsl(261deg 17% 14%) 88%, hsl(259deg 25% 27%) 97%, hsl(258deg 28% 40%) 100%, hsl(258deg 36% 54%) 100% ) `;

 h1{color:white}

 <h1>Body with Linead Gradient Background</h1>