[为了清楚地显示document.write()，我知道这已经过时了，不想重新加载并关闭网站。所以我想出了document.getElementById().innerHTML作为替代方案。
但是，问题是，document.getElementById().innerHTML不能为我带来我写的结果，但是document.write()可以给我带来结果。
所以，如何证明使用document.getElementById().innerHTML的结果是document.write()代码？
尽管我一直在寻找.write和.innerHTML之间的差异，您能否通过我带来的示例来帮助我理解两者之间的显着差异？
这里是代码。
var arrlist = ["Aron", "Bill", "Camile", "Denn", "Earling", "Fiora", "Gibson"];
var a = arrlist.length;
var b = 3;
var c = 3;
function x() {
for (var i = 0; i < b; i++) {
var x = b*(c-1) +i;
var k = i + 1;
if (b*(c-1) +i >= a ) {
var x = (b*(c-1) +i)%a;
document.getElementById('listshow').innerHTML = "<table border='1' width='200px'><thead><tr><th colspan='2'>" +c+ "th list of names</th></tr></thead> <tbody><tr><th width='30%'>" +k+ "th</th><td width='70%' >"+arrlist[x]+ "</td></tr></tbody></table>";
}
}
}
function y() {
for (var i = 0; i < b; i++) {
var x = b*(c-1) +i;
var k = i + 1;
if (b*(c-1) +i >= a ) {
var x = (b*(c-1) +i)%a;
}
document.write("<table border='1' width='200px'><thead><tr><th colspan='2'>" +c+ "th list of names</th></tr></thead> <tbody><tr><th width='30%'>" +k+ "th</th><td width='70%' >"+arrlist[x]+ "</td></tr></tbody></table>");
}
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title></title>
<link href="style.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<button onclick='x();'>document.getElementById().innerHTML</button>
<button onclick='y();'>document.write()</button>
<div id="listshow"></div>
</body>
<script src="script.js"></script>仅仅是因为使用innerHTML，您正在替换元素的内容，而不是向其中添加内容！因此，每次循环迭代时，它只会将最后一次迭代中的所有html只替换为最后一个html！