我的HTML中的随机逗号

Question

我的HTML按钮之间有逗号，我不知道它们来自哪里。 在创建按钮之前，我创建按钮的div是空的。

在我的JavaScript中，我没有任何可以放在按钮之间的逗号，如下所示。

这是一张图片：

我使用JavaScript创建按钮，如下所示：

    var f = "'";
    contents[0]='<button class="btn" onclick="check('+ f + randomChar0 + f +');">' + randomChar0 + '</Button>';
    contents[1]='<button class="btn" onclick="check('+ f + randomChar1 + f +');">' + randomChar1 + '</Button>';
    contents[2]='<button class="btn" onclick="check('+ f + randomChar2 + f +');">' + randomChar2 + '</Button>';

    ranNum0 = randomize(2);
    document.getElementById("response").innerHTML = contents;

在插入按钮之前，我的HTML看起来像这样：

<div id="response" class="center-children">
</div>

插入按钮后，像这样：

<div id="response" class="center-children">
    <button class="btn" onclick="check('B');">B</button>,
    <button class="btn" onclick="check('S');">S</button>,
    <button class="btn" onclick="check('E');">E</button>
</div>

如果我在浏览器中检查，它看起来像这样：

我检查了我的整个JavaScript，甚至试图删除所有的CSS和HTML但是逗号仍留在那里......

有没有人知道可能导致这种情况的原因？

Answer 1

问题是您将数组的字符串值赋给.innerHTML并且数组的字符串值在元素之间包含逗号。

要组合数组中的值，请使用.join() ：

 document.getElementById("response").innerHTML = contents.join('');

或者更好的是，不要使用字符串操作来创建DOM元素。

Answer 2

你将innerHTML设置为一个数组，但它应该是一个字符串。 隐含地，在您的数组上调用.toString() ，这会留下逗号。 试一试， [1,2,3].toString()计算结果为"1,2,3" 。