多个 GetElementByID 不起作用，如何循环 Javascript？

Posted 2023-05-07

【中文标题】多个 GetElementByID 不起作用，如何循环 Javascript？

【英文标题】：Multiple GetElementByID doesn't work, how do I loop Javascript?

【发布时间】：2019-08-18 00:57:32

【问题描述】：

我有多个 getElementById 根据列标题从 Google 表格中提取数据。当我只有一个getElementById 时，它可以完美运行，但是一旦我添加第二个，它就不行了。有人告诉我我需要循环它们，但还不知道怎么做。如果您能帮我循环它们，我将不胜感激。

function httpGetAsync(theUrl, callback) 
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.onreadystatechange = function() 
    if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
      callback(xmlHttp.responseText);
  
  xmlHttp.open("GET", theUrl, true); // true for asynchronous
  xmlHttp.send(null);


httpGetAsync('https://spreadsheet.glitch.me/? 
key = 1 JBbAHH1DFtO1r56lr94lUqd8H7qPcHncJskcPq0r96o ', function(response)
var json = JSON.parse(response);

document.getElementById("btm").innerhtml = json[0].btm;
);

document.getElementById("totalpoints").innerHTML = json[1].totalpoints;
);

document.getElementById("btm").innerHTML = json[1].btm;
);

document.getElementById("average").innerHTML = json[4].average;
);

【问题讨论】：

为什么你的代码中有这么多);？请发布一个minimal reproducible example 编译。请使用能指出所有这些明显错误的代码编辑器

您的第二个、第三个和第四个“document.getElementById”语句超出了 httpGetAsync 回调方法的范围。 json var是在回调方法的范围内定义的，因此无法访问

您的代码有语法错误。保持浏览器控制台打开，以便您注意到它们。

您会收到两次"btm"。第二次覆盖第一次。

【参考方案1】：

你正在用额外的“);”关闭你的回调函数在每个 document.getElementById...

删除它们，您的代码应该可以工作。

function httpGetAsync(theUrl, callback)  
  var xmlHttp = new XMLHttpRequest();
  xmlHttp.onreadystatechange = function() 
  if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
     callback(xmlHttp.responseText);
  
  xmlHttp.open("GET", theUrl, true); // true for asynchronous
  xmlHttp.send(null);


httpGetAsync('https://spreadsheet.glitch.me/?key=1JBbAHH1DFtO1r56lr94lUqd8H7qPcHncJskcPq0r96o', function(response) 
var json = JSON.parse(response);

document.getElementById("btm").innerHTML = json[0].btm;
document.getElementById("totalpoints").innerHTML = json[1].totalpoints;
document.getElementById("btm").innerHTML = json[1].btm;
document.getElementById("average").innerHTML = json[4].average;
);

<div id="btm"></div>
<div id="totalpoints"></div>
<div id="average"></div>

【讨论】：

运行这段代码，上面写着"Uncaught SyntaxError: Invalid or unexpected token"

@JeremyThille 我复制粘贴了一个额外的回车符。解决了这个问题。谢谢