Javascript 为什么赢了'；我的函数结果不能用HtML打印吗？

我已经搜索了类似的问题，并尝试了一些不同的方法，但是JavaScript函数生成的列表在运行后不会显示在HTML中。一个似乎一直出现的错误是：

document.getElementByID（…）

为空。这是我的密码：

HTML：

      <input type="button" value="Natural Supports List" onclick="naturalSupports();"/>
    <p id="output"></p>

document.getElementById("Natural Supports List").onclick = function naturalSupports (e){
  e.preventDefault();
  var output = document.getElementById("output").value;
  output.innerHTML(userMessage);

}
  function naturalSupports(){

    var supports = [];
    var userSupports = "";
    var supportsloop = true;
    var totalSupports = 0;
    var userMessage = "";

    while (supportsloop) {
      userSupports = prompt("Enter one of your natural supports, or leave blank to stop.");
      if (userSupports === ""){
        supportsloop = false;
      }else{
        supports.push(userSupports); 
      }
    }

    totalSupports = supports.length;
    var userList;

    for(var index=0; index < supports.length; index++) {
      userList = supports[index] + "<br>";
    }


    listMessage = "Here is a list of your supports: ";
    userMessage = "<strong>Here is a list of your supports: </strong><br>" + userList;

    return userMessage;        
  }

JavaScript：

      <input type="button" value="Natural Supports List" onclick="naturalSupports();"/>
    <p id="output"></p>

document.getElementById("Natural Supports List").onclick = function naturalSupports (e){
  e.preventDefault();
  var output = document.getElementById("output").value;
  output.innerHTML(userMessage);

}
  function naturalSupports(){

    var supports = [];
    var userSupports = "";
    var supportsloop = true;
    var totalSupports = 0;
    var userMessage = "";

    while (supportsloop) {
      userSupports = prompt("Enter one of your natural supports, or leave blank to stop.");
      if (userSupports === ""){
        supportsloop = false;
      }else{
        supports.push(userSupports); 
      }
    }

    totalSupports = supports.length;
    var userList;

    for(var index=0; index < supports.length; index++) {
      userList = supports[index] + "<br>";
    }


    listMessage = "Here is a list of your supports: ";
    userMessage = "<strong>Here is a list of your supports: </strong><br>" + userList;

    return userMessage;        
  }

document.getElementById（“自然支持列表”）.onclick=函数自然支持（e）{
e、 预防默认值（）；
var output=document.getElementById（“output”）.value；
innerHTML（userMessage）；
}
函数自然支持（）{
var支持=[]；
var userSupports=“”；
var supportsloop=true；
var totalSupports=0；
var userMessage=“”；
while（supportsloop）{
userSupports=prompt（“输入您的自然支持之一，或留空以停止”）；
如果（用户支持===“”）{
supportsloop=false；
}否则{
push（userSupports）；
}
}
totalSupports=supports.length；
var用户列表；
对于（var索引=0；索引”；
}
listMessage=“这是您的支持列表：”；
userMessage=“以下是您的支持列表：
”+用户列表；
返回用户消息；
}

您的按钮有任何id吗？ “自然支持列表”是按钮的值。 因此，不能使用

document.getElementsById

获取元素。 将

id

属性添加到按钮。该函数将运行

---

顺便说一下，您最好命名为

id

使用不带空格的单词。

您可以直接从按钮单击操作调用函数， 因此，如下更改Javascript代码

function naturalSupports(){

    var supports = [];
    var userSupports = "";
    var supportsloop = true;
    var totalSupports = 0;
    var userMessage = "";

    while (supportsloop) {
      userSupports = prompt("Enter one of your natural supports, or leave blank to stop.");
      if (userSupports === ""){
        supportsloop = false;
      }else{
        supports.push(userSupports); 
      }
    }

    totalSupports = supports.length;
    var userList;

    for(var index=0; index < supports.length; index++) {
      userList = supports[index] + "<br>";
    }


    listMessage = "Here is a list of your supports: ";
    userMessage = "<strong>Here is a list of your supports: </strong><br>" + userList;

  var output = document.getElementById("output").value;
  output.innerHTML(userMessage);
  }

函数自然支持（）{
var支持=[]；
var userSupports=“”；
var supportsloop=true；
var totalSupports=0；
var userMessage=“”；
while（supportsloop）{
userSupports=prompt（“输入您的自然支持之一，或留空以停止”）；
如果（用户支持===“”）{
supportsloop=false；
}否则{
push（userSupports）；
}
}
totalSupports=supports.length；
var用户列表；
对于（var索引=0；索引”；
}
listMessage=“这是您的支持列表：”；
userMessage=“以下是您的支持列表：
”+用户列表；
var output=document.getElementById（“output”）.value；
innerHTML（userMessage）；
}

请尝试以下代码：- HTML

<input type="button" value="Natural Supports List" id="natural" onclick="naturalSupports();"/>
    <p id="output"></p>

Java脚本

  function naturalSupports(){

    var supports = [];
    var userSupports = "";
    var userList = "";
    var supportsloop = true;
    var totalSupports = 0;
    var userMessage = "";

    while (supportsloop) {
      userSupports = prompt("Enter one of your natural supports, or leave blank to stop.","");
      if (userSupports === ""){
        supportsloop = false;
      }else{
        supports.push(userSupports); 
      }
    }

    totalSupports = supports.length;
    var userList;

    for(var index=0; index < supports.length; index++) {
      userList += supports[index] + "<br>";
    }


    listMessage = "Here is a list of your supports: ";
    userMessage += "<strong>Here is a list of your supports: </strong><br>" + userList;

   document.getElementById("output").innerHTML += userMessage;
  }

函数自然支持（）{
var支持=[]；
var userSupports=“”；
var userList=“”；
var supportsloop=true；
var totalSupports=0；
var userMessage=“”；
while（supportsloop）{
userSupports=prompt（“输入您的自然支持之一，或留空以停止。”，“”）；
如果（用户支持===“”）{
supportsloop=false；
}否则{
push（userSupports）；
}
}
totalSupports=supports.length；
var用户列表；
对于（var索引=0；索引”；
}
listMessage=“这是您的支持列表：”；
userMessage+=“以下是您的支持列表：
”+userList；
document.getElementById（“输出”）.innerHTML+=userMessage；
}

---

它运转得很好

有一件事是

。getElementById（“自然支持列表”）

没有意义，因为您没有具有匹配id的元素（因此将返回

null

）。另一件事是，您应该从

document.getElementById（“output”）.value

中删除

.value

部分，因为（a）段落元素没有

.value

，并且（b）您需要对元素本身的引用，以便可以在下一行说

output.innerHTML

。第三件事是唯一一个调用

naturalsupport（）

的地方，它对返回值没有任何作用，因此显然该值不会出现在文档中…

文档中。getElementById（“自然支持列表”）

未定义。但是，这只是许多不好的做法之一。“Natural Supports List”缺少具有此id属性的元素，并且id属性中不应该有空格。在HTML之后的代码中，如果有

onclick

，则代码中的JS也不是函数，相反，您希望

innerHTML=…etc

I.可以。吻你。认真地非常感谢你！当我在这里的时候，如果有人建议我在哪里可以更好地编码，我将非常感谢！我的寒假就要到了，我想好好工作，我知道我还有很多东西要学！你可以从网上学到很多东西。试着用心学习磷浓度非常重要：）。好luckI在我的手机上有soloLearn应用程序，我以前也试过CodeAcademy。谢谢你的建议。集中注意力对我来说是件困难的事——我的房子总是乱七八糟的。我将致力于建立一个应急/编码室！：）