将javascript代码放在 <head> 标签

Question

我想使用匿名函数将脚本放在<head>标记之间，并添加onclick事件以更改标记p的内容，但是单击后什么也没有发生。 我的脚本有什么问题吗，请帮帮我。 谢谢

<!DOCTYPE html> <html lang="en">    
<head>      
  <title>web</title>
  <script>
        window.onload=function(){
            function rubah1(){
                document.getElementById("text1").innerHTML="SUDAH BERUBAH TEXT 1";
            }
        }       
  </script>     
</head>     
<body>      
  <p id="text1">Teks 1 Sebelum Di Rubah</p>
  <button type="button" onclick="rubah1();">Rubah Text 1</button>   
</body> 
</html>

Answer 1

~~请下次更好地格式化代码。~~ 您无需等待文档加载就可以定义函数。 您只需在头部定义，然后该按钮将起作用。 工作代码段：

  <!DOCTYPE html> <html lang="en"> <head> <title>web</title> <script> function rubah1() { document.getElementById("text1").innerHTML = "SUDAH BERUBAH TEXT 1"; } </script> </head> <body> <p id="text1">Teks 1 Sebelum Di Rubah</p> <button type="button" onclick="rubah1();">Rubah Text 1</button> </body> </html>

方法的问题是，您在onload函数的内部范围内定义了该函数，因此该按钮对按钮不可见。

Answer 2

函数rubah1在onload中定义。 因此，它的范围不是全球性的。 函数rubah1的生命仅在onload内。 超出onload范围的代码无法调用它，因为该代码不知道存在名为rubah1的函数。 您可以删除onload，因为它似乎并没有增加任何价值。
您可以通过参考以下内容来帮助自己：它将清除您的概念： w3schools Javascript范围教程。

更新的代码：

<!DOCTYPE html> <html lang="en">    
<head>      
  <title>web</title>
  <script>
    window.onload=function(){
        function rubah1(){
            document.getElementById("text1").innerHTML="SUDAH BERUBAH TEXT 1";
        }
    }       
</script>     
</head>     
<body>      
  <p id="text1">Teks 1 Sebelum Di Rubah</p>
  <button type="button" onclick="rubah1();">Rubah Text 1</button>   
</body>

将javascript代码放在 <head> 标签

问题描述

2 个解决方案

解决方案1
4 已采纳 2017-12-30 14:08:59

解决方案2
1 2017-12-30 14:11:18

将javascript代码放在 <head> 标签

问题描述

2 个解决方案

解决方案1 4 已采纳 2017-12-30 14:08:59

解决方案2 1 2017-12-30 14:11:18

解决方案1
4 已采纳 2017-12-30 14:08:59

解决方案2
1 2017-12-30 14:11:18