HTML Javascript 在实时代码编辑器中插入脚本标签时出现问题

Question

我几天前使用 ace 1.2.9 库制作了实时代码编辑器。我没有遇到任何问题运行我网站的几个指南。现在我正在尝试创建这个非常简单和基本的示例。但是当我尝试在文本区域（你想为指南插入文本的地方）写入文本时，studio 代码编译器出现错误，它不会加载。问题是当我添加这一行时：（它在文本区域，不应该影响编辑器代码：

document.getElementById("test").innerHTML = "Hello JavaScript";

代码：

<body onload="ready()">
    <div id="container">
      <div id="editor"></div>
      <iframe id="iframe" frameborder="0"> </iframe>
    </div>
    <script>
      function update() {
        var idoc = document.getElementById("iframe").contentWindow.document;
        idoc.open();
        idoc.write(editor.getValue());
        idoc.close();
      }
      function setupEditor() {
        window.editor = ace.edit("editor");
        editor.setTheme("ace/theme/monokai");
        editor.getSession().setMode("ace/mode/html");
        editor.setValue(

  `  
     <!-- You can test freely     
       with our live code editor. -->

       <html>
<body>

  <h2>Free code wiki</h2>

<p id="test"></p>

<script>
document.getElementById("test").innerHTML = "Hello JavaScript";
</script>

</body>
</html>



`,
          1
        ); //1 = moves cursor to end

        editor.getSession().on("change", function() {
          update();
        });

        editor.focus();

        editor.setOptions({
          fontSize: "16pt",
          showLineNumbers: false,
          showGutter: false,
          vScrollBarAlwaysVisible: true,
          enableBasicAutocompletion: false,
          enableLiveAutocompletion: false
        });

        editor.setShowPrintMargin(false);
        editor.setBehavioursEnabled(false);
      }

      function ready() {
        setupEditor();
        update();
      }
    </script>
  </body>
</html>

错误：

Unterminated template literal

Answer 1

您必须转义 <script> 标记，因为它在字符串中

比如

<script>
...
<\/script

Answer 2

您有很多语法错误，您有 3 个标签缺少结束标签。 editor.setValue( closing ) 在哪里？

您有 2 个结束标签。

你从哪里复制这段代码的？

HTML Javascript 在实时代码编辑器中插入脚本标签时出现问题

HTML Javascript problem inserting script tag in live code editor

javascript

ace-editor

代码：

错误：