如何在 div 中获取到 运行 的处理脚本

How to get a processing script to run in a div

我正在制作一个需要将字符串转换为 processing.js 脚本的程序。目前,下面的代码制作了一个 <script type="text/processing" data-processing-target="canvas"> 标签并在其中添加了一个字符串,但是我如何将它变成 运行?

 function runProcessing() {
            var input = "<script type=\"text/processing\" data-processing-target=\"canvas\">";
            input += document.getElementById("userInput").value;
            document.getElementById('processingCode').innerHTML = input;
            console.log(document.getElementById('processingCode').innerHTML);
        }

换句话说,我该如何打开它...

void setup() {}

进入这个...

<script type="text/processing" data-processing-target="canvas">
void setup() {}
</script>

和运行它。

您只需要创建一个新的 Processing 实例,传入目标 canvas 和草图源。您不需要实际将 html 添加到 dom

var canvas = document.getElementById('yourCanvasID');
var source = document.getElementById("userInput").value;

var instance = new Processing(canvas, source);

但如果您确实希望将其添加为 html,您应该能够在添加 html 后调用 Processing.reload() 以重新初始化草图