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



几天前我用ace 1.2.9库制作了实时代码编辑器。 我为我的网站运行几个指南没有问题。 现在我正在尝试创建这个非常简单和基本的示例。 但是当我尝试在文本区域(您假设在其中插入指南文本(中编写文本时,Studio Code 编译器出现错误,并且它不会加载。 问题是当我添加此行时:(它在文本区域中,应该不会影响编辑器代码:

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

你必须转义<script>标签,因为它在一个字符串中

<script>
...
</script

您有很多语法错误,您有 3 个标签缺少关闭标签。编辑器.setValue(关闭(在哪里?

您有 2 个结束标签。

你从哪里复制这个代码??

相关内容

  • 没有找到相关文章

最新更新