javascript - 从 JavaScript 在 HTML 上打印文本

Question

我有这个 for 循环

<script>
...
for(i = 0;i < json.length;i++){      
  document.getElementById("pText").innerHTML = json[i].name;
  document.getElementById("pLink").setAttribute("href",json[i].html_url);
}
</script>

我想在每个循环中打印一个带有 href 的段落，所以我这样做了:

</script>

<a id="pLink">
   <p id="pText">
   </p>
</a>

它可以工作，但问题是它只打印最后一个循环。所以我在脚本中尝试了这个

document.write("<a href=\"" + json[i].html_url + "\">");
document.write("<p>" + json[i].name + "</p>");
document.write("</a>");

而不是这个:

document.getElementById("pText").innerHTML = json[i].name;
document.getElementById("pLink").setAttribute("href",json[i].html_url);

它打印了我想要的所有内容，但它替换了整个页面。我怎样才能做到这一点？我需要为每个循环创建一个 id 吗？比如 "pText1, pText2, etc.

Answer 1

为该循环创建一个容器元素，并按照您的想法添加 html

<div id="container"></div>

然后在 javascript 中

var container = document.getElementById('container');
var my_html = '';
for(var i = 0;i < json.length;i++){  
  my_html += '<a href="' + json[i].html_url + '\">';
  my_html += '<p>'+  json[i].name + '</p>'
  my_html += '</a>'
}
container.innerHTML = my_html;

我们在这里做的是根据需要多次将内容添加到字符串中，然后将其添加到容器中，这样它就已经有了所有的循环