Question

我从学校得到了作业。我必须创建有关JavaScript的测验。我已经完成了可视化部分，已经制作了问题模板，并在JavaScript中动态创建了id，以使所有内容井井有条。看起来不错，现在我必须做两件事： 1.我想从firebase下载问题（我会自己完成）。 2.正如我提到的，我已经准备好单个问题的模板，它只需要问题和答案（将在firebase中完成），但是问题是：我们有一个用HTML完成的单个问题的模板，由于代码读取，我不想复制和粘贴30次（因为我必须做30个问题），所以JS中有什么技巧可以复制模板问题并粘贴到HTML特定时间（循环）中？

这是一个问题模板，实际上必须将其复制并粘贴到index.html中29次：

<section class="flexbox-center">
      <div class="question-zone">
          <div class="question flexbox-center">
              <span>Sample question</span>
          </div>
          <div class="answers">
              <div class="answer-1 flexbox-center">
                  <input type="radio" name="answer" value="A" />
                  <strong>A.</strong><span style="margin-left: 2px;"> Answer-1</span>
              </div>
              <div class="answer-2 flexbox-center">
                  <input type="radio" name="answer" value="B" />
                  <strong>B.</strong><span style="margin-left: 2px;"> Answer-2</span>
              </div>
              <div class="answer-3 flexbox-center">
                  <input type="radio" name="answer" value="C" />
                  <strong>C.</strong><span style="margin-left: 2px;"> Answer-3</span>
              </div>
              <div class="answer-4 flexbox-center">
                  <input type="radio" name="answer" value="D" />
                  <strong>D.</strong><span style="margin-left: 2px;"> Answer-4</span>
              </div>
          </div>
      </div>
  </section>

Answer 1

您可以像在帖子评论中@Niet所说的那样使用它，也可以根据需要将其设置为“懒惰”甚至肮脏。但是您可以将这种<section>格式的整个HTML代码存储到JavaScript中的var中，然后将其放回到<body>中。

结构如下：

JS：

var element = document.getElementsByTagName("SECTION")[0];
var copy = element.cloneNode(true);
document.body.appendChild(copy);

您可以使用它进行循环，并在需要时重复29次，但是给出了其工作原理的基础。希望对您有所帮助。

复制HTML并使用JavaScript粘贴

1 个答案: