Javascript 流程图.js无法从getElementById呈现代码

我是JavaScript的新手。我尝试使用floppt.js制作一个图表。从这里的示例代码

www.js·游乐场
.end元素{背景色：#FFCCFF；}
window.onload=函数（）{
var btn=document.getElementById（“运行”），
cd=document.getElementById（“代码”），
图表
（btn.onclick=函数（）{
var代码=cd.value；
如果（图表）{
chart.clean（）；
}
图表=流程图。解析（代码）；
chart.drawSVG（'canvas'{
//“x”：30，
//y:50岁，
“线宽”：3，
“maxWidth”：3，//确保流程图符合一定的宽度
“行长度”：50，
“文本边距”：10，
“字体大小”：14，
'字体'：'正常'，
“字体系列”：“Helvetica”，
“字体大小”：“正常”，
“字体颜色”：“黑色”，
“线条颜色”：“黑色”，
“元素颜色”：“黑色”，
“填充”：“白色”，
“是文本”：“是”，
“无文本”：“无”，
“箭头结束”：“块”，
“比例”：1，
“符号”：{
“开始”：{
“字体颜色”：“红色”，
“元素颜色”：“绿色”，
“填充”：“黄色”
},
“结束”：{
“类”：“结束元素”
}
},
“流动状态”：{
'过去'：{'填写'：'#中交'，'字体大小：12}，
'当前'：{'fill'：'白色'，'字体颜色'：'红色'，'字体重量'：'粗体'}，
“future”：{“fill”：#FFFF99}，
'request'：{'fill'：'blue'}，
'无效'：{'fill'：'#444444'}，
“已批准”：{“填充”：“#58C4A3”，“字体大小”：12，“是文本”：“已批准”，“无文本”：“不适用”}，
“拒绝”：{“填充”：“C45879”，“字体大小”：12，“是文本”：“n/a”，“无文本”：“拒绝”}
}
});
$（'[id^=sub1]'）。单击（函数（）{
警报（“此处信息”）；
});
})();
};
st=>开始：开始|过去：>http://www.google.com[空白]
e=>end:end:>http://www.google.com
op1=>操作：CAT1 |过去
op2=>操作：第2类|电流
op3=>操作：CAT3 |未来
op4=>操作：CAT4 |未来
op1->op2->op3->op4
跑

我认为您不能使用

document.getElementById（）

，因为它不在同一

文档中。您可以尝试将
脚本
标记放在id所在的同一文档中。
我试图了解它是如何工作的，但仍然感到困惑。我已经尝试将循环函数移到window.onload函数中，但仍然是错误的。如果ID不在那里，为什么它会显示在这里的代码中