如何在 ace-editor 中执行用户的代码
发布于2022-03-21 03:24 阅读(1046) 评论(0) 点赞(27) 收藏(0)
我正在开发一个应用程序，它允许用户在 ace-editor 中输入 JavaScript 和 HTML。布局将如下所示：
希望你得到我想要做的事情，当用户点击运行按钮时，将执行以下脚本，但我不知道如何打印用户编写的代码的输出。
运行功能代码：
let { jsVal, htmlVal, cssVal } = this.state; // this gets all three editor values
var script = document.createElement('script');
var iframe = document.createElement('iframe');
var html = `<html><head><style>${cssVal}</style></head><body>${htmlVal} <script>${jsVal}</script></body></html>`;
iframe.src = 'data:text/html;charset=utf-8,' + encodeURI(html);
document.body.appendChild(iframe);
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(html);
iframe.contentWindow.document.close();
iframe.onload = function() {
var div = iframe.contentWindow.document;
iframe.contentWindow.document.getElementsByTagName('html')[0]
};
iframe.contentWindow.document.getElementsByTagName('html')给我这个，
<html><head><style>#editor {
background: "#ddd";
}</style></head><body><div id="editor">Thu Feb 28 2019 18:36:07 GMT+0530 (India Standard Time)</div><script>document.getElementById('editor').innerHTML = Date()</script></body></html>
我一直在努力让它在输出容器中执行，任何线索或帮助都会让我开心。如果您需要更多详细信息，我已准备好提供。提前致谢。
解决方案
Ace-Editor 只是一个编辑器。如果你想执行你的代码，你需要自己实现......
所属网站分类: 技术文章 > 问答
作者：黑洞官方问答小能手
链接：http://www.qianduanheidong.com/blog/article/319780/7197b6075a0cf4a3a691/
来源：前端黑洞网
任何形式的转载都请注明出处,如有侵权 一经发现 必将追究其法律责任
昵称:
评论内容：(最多支持255个字符)
---无人问津也好，技不如人也罢，你都要试着安静下来，去做自己该做的事，而不是让内心的烦躁、焦虑，坏掉你本来就不多的热情和定力