Javascript 我的桌子赢了'；你不去下一排吗？

我正在做一份有10个问题的数学工作表样本。有一个模板，我已经转换成字符串，一旦用户按下“生成问题”按钮，将在我的页面中输出10次（每个问题一个）。模板由表格组成——一行用于问题，另一行用于答案。它应该是这样的：
（请注意，这是在我将表转换为JavaScript字符串之前。之前它是纯HTML。）

然而，在制作模板之后，我得到了这样的结果，尽管我相信我正确地插入了

：

我遇到了麻烦，我似乎找不到解决办法

这是我的JS模板代码。字符串很长，因此关键字搜索“此处是断点”可跳转到我希望断点所在的位置：

 // ---------- print template ----------
        var idQuestion =  "question" + i;
        var szQuestionHTML = '<td style="background-color: #66ff99;">' + i + '.' + '</td> <td style="background-color: #66ff99;" colspan="2" align="center"> <table> <tbody> <tr> <td id="qnom">' + qnom + '</td> </tr> <tr> <td id="qdenom" style="border-top: 2px solid rgb(0, 0, 0);">' + qdenom + '</td> </tr> </tbody> </table> </td> <td style="background-color: #66ff99;"> </td> </tr><br><!--here is the break that doesnt work--> <tr> <!--q1 options--> <td style="background-color: #cccccc;">a. <table> <tbody> <tr> <td id="a1">' + a1/*a1*/ + '</td> </tr> <tr> <td id="a2" style="border-top: 2px solid rgb(0, 0, 0);">' + a2 + '</td> </tr> </tbody> </table> </td> <td style="background-color: #cccccc;">b. <table> <tbody> <tr> <td id="b1">' + b1 + '</td> </tr> <tr> <td id="b2" style="border-top: 2px solid rgb(0, 0, 0);">' + b2/*b2*/ + '</td> </tr> </tbody> </table> </td> <td style="background-color: #cccccc;">c. <table> <tbody> <tr> <td id="c1">' + c1+ '</td> </tr> <tr> <td id="c2" style="border-top: 2px solid rgb(0, 0, 0);">' + c2 + '</td> </tr> </tbody> </table> </td> <td style="background-color: #cccccc;">d. <table> <tbody> <tr> <td id="d1">' + d1 + '</td> </tr> <tr> <td id="d2" style="border-top: 2px solid rgb(0, 0, 0);">' + d2 + '</td> </tr> </tbody> </table> </td>';


        document.getElementById(idQuestion).innerHTML = szQuestionHTML;
// ---------- end print template ----------

/------------打印模板----------
var idQuestion=“问题”+i；
var szQuestionHTML=''+i++''+qnom++'+qdenom++'
a.+a1/*a1*/+'+a2+'b.+b1+''+b2/*b2*/+'c.+c1+''+c2+'d.+d1+“”+d2+“”；
document.getElementById（idQuestion.innerHTML=szQuestionHTML；
//------结束打印模板----------

这里是打印模板的地方（假设每个问题有10个，分别命名为问题2、问题3等）：

我不想通过jQuery或任何其他扩展/库来解决这个问题，因为我想知道这个问题的根源。当然，除非这是不可能解决的，我对此深表怀疑。提前谢谢

---

编辑：我通过分离问题字符串和答案字符串解决了这个问题。

你能展示一下你尝试过的内容吗？如果你检查被破坏的呈现html，你可能会看到你的“破坏”在已经关闭的

表

或

tr

或其他东西之外掉落。@CaffGeek在这里，但“生成问题”按钮由于某种原因根本不起作用。首先，我注意到表之间有一些换行符（

）；你不应该那样做；这不是真的有效。表行（

）已在下一行。@etorn10重新定位

对我不起作用。我得到了同样的结果。