简单的javascript函数没有'；当放置在标签外时不工作

我有一个函数可以更改段落内容：

function test() {      
  document.getElementById("demo").innerHTML = "ops2"
}

在标签内使用时，它可以正常工作：

<button type="button" onclick='document.getElementById("demo").innerHTML = "ops"'>Change Content</button>

更改内容

但是，当放置在函数外部时，它不起作用：

<button type="button" onclick=test()>load</button>

加载

---

这是一本书。我做错了什么？

这只是脚本和html代码的顺序问题。当我将

test

函数放在html代码之上，然后用

onclick=“test（）”

调用该函数时，它工作得很好

下面是我所做的：（注意

更改内容
按钮标签）。


功能测试（）{
document.getElementById（“demo”）.innerHTML=“ops2”
}
你好
这里有一些文字





更改内容




光
黑暗的
隐藏
显示
您的小提琴没有使用该功能。。。如果是这样，你需要将JS设置中的“加载类型”更改为
No wrap-in
，我想你可能链接到了错误的小提琴？问题中给出的代码本身运行良好。（将onclick括在引号中可能是个好主意：
onclick=“test（）”
，但即使没有引号，它也能正常工作。）我会用引号来写函数名。在onclick处理程序中调用函数时，脚本的顺序并不重要。当用户单击按钮时，所有内容都已加载。但我建议的方式使其工作正常，JSFIDLE给出了一个错误，即未定义
test
。是的，这是因为JSFIDLE将JS代码放在window.onload事件处理程序中，该处理程序将函数带出全局范围。与脚本顺序无关。如果将函数放在页面的末尾，代码也会工作得很好。
<script>
    function test(){
       document.getElementById("demo").innerHTML = "ops2"
    }
</script>

<h3 id="demo">Hello</h3>
<p>Here is some text</p>
<center>
  <img id="lamp" src="https://www.w3schools.com/js/pic_bulboff.gif"/>
  <br/><br/><br/>
  <button type="button" onClick='test()'>Change Content</button>
  <br/><br/><br/>
  <button type="button" onClick='document.getElementById("lamp").src = "https://www.w3schools.com/js/pic_bulbon.gif"'>Light</button>
    <button type="button" onclick='document.getElementById("lamp").src = "https://www.w3schools.com/js/pic_bulboff.gif"'>Dark</button>
  <button type="button" onclick='document.getElementById("lamp").src = ""'>Hide</button>
  <button type="button" onclick='document.getElementById("lamp").src = "https://www.w3schools.com/js/pic_bulboff.gif"'>Show</button>
</center>