时间戳

首页 > 解决方案 > 未捕获的类型错误：无法将属性“innerHTML”设置为 null :(

javascript - 未捕获的类型错误：无法将属性“innerHTML”设置为 null :(

问题描述

我认为代码 100% 正常，但为什么我得到那个错误？？？？：未捕获的类型错误：无法设置属性 'innerHTML' of null||

代码是：

<!DoCTYPE html>
<html lang="eng">
<head>
    <meta charset ="utf-8">
    <meta name="" content="">
    <title></title>
    <script>
        function myAgeInDays() {
        
        "use strict";
        
        var myAge = 15;
        
        return myAge * 365;
    
    }
    
    var daysCalc = myAgeInDays();
    
    document.getElementById("test").innerHTML =
    
        "Your Age In Days = "+ daysCalc+ " Day";
    </script>
</head>

<body>
    <button onclick="myinfo();">OK</button>
    <h1 id="test">Ok</h1>
</body>
    
</html>

标签： javascript

解决方案

可以做一些事情来改善这个问题：

给出一些上下文，而不是控制台打印出的错误

尤其是在非常常见的 js 错误的情况下。您的案例的一个示例可能是“在表单提交中无法选择 html 元素/选择器在 onclick 函数中为空”。

陈述你尝试过的一些事情

这将帮助您成长为开发人员（老教人钓鱼的故事）

更多提示：https ://stackoverflow.com/help/how-to-ask

在您的情况下，您发布的代码不起作用（myinfo 未定义）并且您的代码在创建<head>之前定义的<p>。将其添加到正文的末尾以确保创建所有元素。如果您想让一个函数处理包含您的逻辑的按钮单击，您可以编写如下内容：

<body>
  <button id="calcDays">OK</button>
  <h1 id="test">Ok</h1>
  <script type="text/javascript">
    document.getElementById('calcDays')
      .addEventListener('click', function () {
          function myAgeInDays(days) {
            return days * 365;
          }

          document.getElementById("test").textContent =
            `Your Age In Days = ${myAgeInDays(15)} Days`;
      });
  </script>
</body>

推荐阅读