Question

<head>
  <script>
    var bgcolor = #ff0000
  </script>
</head>
<body style="background-color: var(--bgcolor);">
</body>

我想使一份联合材料的功能改变某些投入的背景。我玩弄联合材料的功能,我只能拿“var”在超文本档案中工作。有些人可以检查我的正确性。

Answer 1

虽然变量在名称和使用上相同,但实施这些变量的方式在中央支助事务和 Java之间有所不同。它们不可互换。谨请将此文件编成类似文件:

<head>
  <style>
    :root {
      --bgcolor: #ff0000
    }
  </style>
</head>
<body style="background-color: var(--bgcolor);">
</body>

Answer 2

答案是否简短? CSS变量与联合材料变量不同

FYK: 一种很好的替代办法是使用一种DOM方法,但我在此解释说,尽管我并不认为这种方法对本案确实有用(肯定会是后来的o):

PS: I assume you re beginning with js, but I d recommend using let or const to declare variables, I ll let you do some research about that.

Answer 3

This will not work because HTML is a markup language and is a static page by default. It does not have the ability to render dynamic properties by itself. This is where JS is beneficial because it can manipulate the DOM.

To get something like this to work you would need to add some Element in your HTML Markup that you can add a listener to in your JS script and then run some code when it is triggered.

一个州将为此而努力,但铭记有MANY形式的内容选择从听众那里增加听众和特定类别的触发因素。

You can read this to for more info: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

<!DOCTYPE html>
<html>
<body>

<h1>The Document Object</h1>
<h2>The body Property</h2>

<p>Change the background color of this document.</p>

<button id="submit">Submit</button>

<script>
const button = document.getElementById("submit")

const changeBackgroundColor = () => {
    document.body.style.backgroundColor = "#ff0000";
}

button.addEventListener("click", changeBackgroundColor)

</script>

</body>
</html>

友情链接