JavaScript函数和按钮_Javascript_Html_Css

JavaScript函数和按钮

javascript html css

JavaScript函数和按钮,javascript,html,css,Javascript,Html,Css,我是JavaScript的初学者。我一直在尝试使用以下两个功能更改HTML内容，这两个功能应该由按钮单击触发： <body> <p id="demo">This is a demonstration.</p> <button onclick="myFunction()">Click Me!</button> <p id="demo2">JavaScript can change the style of an

我是JavaScript的初学者。我一直在尝试使用以下两个功能更改HTML内容，这两个功能应该由按钮单击触发：

<body>

  <p id="demo">This is a demonstration.</p>
  <button onclick="myFunction()">Click Me!</button>

  <p id="demo2">JavaScript can change the style of an HTML element.</p>
  <button onclick="myFunction2()">Click me!</button>


  <script>
  function myFunction() {
      document.getElementById("demo").innerHTML = "Hello JavaScript!";
  }

  function myFunction2(){
      document.getElementByID("demo2").style.fontSize="25px";
      document.getElementByID("demo2").style.color="red";
      document.getElementByID("demo2").style.background-color="yellow";
  }
  </script>

</body>


这是一个演示
点击我！
JavaScript可以更改HTML元素的样式
点击我！
函数myFunction（）{
document.getElementById（“demo”）.innerHTML=“Hello JavaScript！”；
}
函数myFunction2（）{
document.getElementByID（“demo2”）.style.fontSize=“25px”；
document.getElementByID（“demo2”）.style.color=“红色”；
document.getElementByID（“demo2”）.style.background color=“黄色”；
}

由于某些原因，我不明白这两个函数不是同时工作的，而是分开工作的

提前非常感谢

您的代码中有两个错误

在

myFunction2

中，您错贴了

getElementByID

=>它是

getElementByID

在

myFunction2

中，您将

backgroundColor

=>错贴了

backgroundColor

属性或函数的名称中不允许使用“连字符”

更正后，代码运行良好。下面是片段

函数myFunction（）{
document.getElementById（“demo”）.innerHTML=“Hello JavaScript！”；
}
函数myFunction2（）{
document.getElementById（“demo2”）.style.fontSize=“25px”；
document.getElementById（“demo2”）.style.color=“红色”；
document.getElementById（“demo2”）.style.backgroundColor=“黄色”；
}


这是一个演示
点击我！
JavaScript可以更改HTML元素的样式
点击我！

您的代码中有两个错误

在

myFunction2

中，您错贴了

getElementByID

=>它是

getElementByID

在

myFunction2

中，您将

backgroundColor

=>错贴了

backgroundColor

属性或函数的名称中不允许使用“连字符”

更正后，代码运行良好。下面是片段

函数myFunction（）{
document.getElementById（“demo”）.innerHTML=“Hello JavaScript！”；
}
函数myFunction2（）{
document.getElementById（“demo2”）.style.fontSize=“25px”；
document.getElementById（“demo2”）.style.color=“红色”；
document.getElementById（“demo2”）.style.backgroundColor=“黄色”；
}


这是一个演示
点击我！
JavaScript可以更改HTML元素的样式
点击我！

您在

myFunction2

getElementById
             ^ small letter

及

函数myFunction（）{
document.getElementById（“demo”）.innerHTML=“Hello JavaScript！”；
}
函数myFunction2（）{
document.getElementById（“demo2”）.style.fontSize=“25px”；
document.getElementById（“demo2”）.style.color=“红色”；
document.getElementById（“demo2”）.style.backgroundColor=“黄色”；
}

这是一个演示
点击我！
JavaScript可以更改HTML元素的样式
点击我您在myFunction2

getElementById
             ^ small letter

及

函数myFunction（）{
document.getElementById（“demo”）.innerHTML=“Hello JavaScript！”；
}
函数myFunction2（）{
document.getElementById（“demo2”）.style.fontSize=“25px”；
document.getElementById（“demo2”）.style.color=“红色”；
document.getElementById（“demo2”）.style.backgroundColor=“黄色”；
}
这是一个演示
点击我！
JavaScript可以更改HTML元素的样式
点击我什么是在同一时间？你说的“函数不在同一时间工作”是什么意思？是的，我希望它们做不同的事情。因为第二个函数中有语法错误。请注意，ID在所有3行代码中都是大写的。改变它，使其与第一个函数相同。@Nope OP是初学者。他们正在学习如何提问以及如何编码：）什么是同时进行？你说的“函数不能同时工作”是什么意思？是的，我希望他们做不同的事情。因为第二个函数中有语法错误。请注意，ID在所有3行代码中都是大写的。改变它，使其与第一个函数相同。@Nope OP是初学者。他们正在学习如何提问以及如何编码：）