Javascript 从jslet创建HTML元素

我试图创建多个

span

元素，其中包含

，但发现下面的代码创建了3个

，但没有

span

让loadingDots=''；
对于（设i=0；i<3；i+=1）{
const dot=document.createElement（'span'）；
loadingDots+=dot.innerHTML='；
document.body.appendChild（dot）；
}

因为变量赋值

dot.innerHTML=“.”

返回值（

），该值用于+=。所以这条线等于：

loadingDots += ".";

分两行进行：

dot.innerHTML = ".";
loadingDots += dot.outerHTML;

---

我想我的问题是因为我在React

组件中使用了

我在
jsx
上的React文档中找到了解决方案

const LoadingDots = props => {
  const items = [];
  for (let i = 0; i < props.numTimes; i += 1) {
    items.push(props.children(i));
  }
  return <span>{items}</span>;
};

为了更快地测试代码，我将代码块转换为代码段。在我看来，这是完美的工作。如果你检查生成的HTML，它会给出你的三个
。可能是我复制了你的代码并在我的浏览器上运行的副本。它确实生成了3个
。正如其他人所提到的，有3个跨距，在主体上附加了一个点。但我不清楚
loadingDots
变量的用途。那个将包含3个没有跨度的点，但您似乎没有使用它。谢谢@KévinBibollet。我已经更新了问题以包含场景，并更好地解释了我的问题。谢谢。我之前尝试过这个，但它返回的是
“…”
，而不是
…
<LoadingDots numTimes={3}>
  {index => <span key={index}>.</span>}
</LoadingDots>