Javascript嵌套循环未显示完整矩阵

我正在尝试打印一个坐标列表，我认为嵌套循环是合适的方法，因此我编写了以下代码（非常简单）：

当我预计它会继续像：

X: 1 Y: 2 Z: 1
X: 1 Y: 2 Z: 2
X: 1 Y: 2 Z: 3
X: 1 Y: 2 Z: 4
...

就像它只在前两个循环中循环一次

我想我正在尝试做一些非常简单的事情，那么我做错了什么呢

PD：现在我不需要节省内存或任何类型的优化，我知道如果x，y，z值很高，像这样的循环可能会很大

现在我不需要节省内存或任何类型的优化，我知道如果x，y，z值很高，像这样的循环可能会很大

你确实需要这样做，因为你要求浏览器做大量不必要的工作，而且可能达到了极限；否则代码就没问题了

x.innerHTML+=…

是一种反模式。每次从

innerHTML

读取内容时，浏览器都必须遍历使用它的元素的完整树，并使用该DOM树的HTML表示在内存中构建一个字符串；每次分配给它时，浏览器都必须拆下旧的树，解析新的HTML，并构建新的DOM元素来替换旧的树<代码>+=正在读取、添加更多内容，然后分配

在我写这篇文章时（已经写了下面的代码片段），我将原始代码放入其中的JSFIDLE仍然在运行，并且在我开始回答这个问题之前就一直在运行。：-）（编辑：它最终停止，并显示了完整列表。）

相反，创建新节点并附加它。在您的情况下，您甚至可以在将所有

li

s添加到

ul

之前将其添加到文档中，然后通过单个操作将其添加到文档中。如果我这样做了，它会很快起作用：

var x=23；
变量y=34；
var z=28；
var div=document.getElementById（“坐标”）；
var ul=document.createElement（“ul”）；
for（var i=1；i当然有效。对我有效。有什么问题吗？这个简化版本还可以，如果这种行为发生在你的代码中，你可能有另一个代码与
i
，
j
，
x
或
y
变量相互干扰
X: 1 Y: 1 Z: 1
X: 1 Y: 1 Z: 2
X: 1 Y: 1 Z: 3
X: 1 Y: 1 Z: 4
X: 1 Y: 1 Z: 5
X: 1 Y: 1 Z: 6
X: 1 Y: 1 Z: 7
X: 1 Y: 1 Z: 8
X: 1 Y: 1 Z: 9
X: 1 Y: 1 Z: 10
X: 1 Y: 1 Z: 11
X: 1 Y: 1 Z: 12
X: 1 Y: 1 Z: 13
X: 1 Y: 1 Z: 14
X: 1 Y: 1 Z: 15
X: 1 Y: 1 Z: 16
X: 1 Y: 1 Z: 17
X: 1 Y: 1 Z: 18
X: 1 Y: 1 Z: 19
X: 1 Y: 1 Z: 20
X: 1 Y: 1 Z: 21
X: 1 Y: 1 Z: 22
X: 1 Y: 1 Z: 23
X: 1 Y: 1 Z: 24
X: 1 Y: 1 Z: 25
X: 1 Y: 1 Z: 26
X: 1 Y: 1 Z: 27
X: 1 Y: 1 Z: 28

X: 1 Y: 2 Z: 1
X: 1 Y: 2 Z: 2
X: 1 Y: 2 Z: 3
X: 1 Y: 2 Z: 4
...