在做一个页面组件的静态演示库,想给页面里添加一个代码运行框, 找到了这段比较简洁可靠的代码, 分享出来:
以下为引用的内容:
function runCode(obj) {
var box = document.getElementById(obj); //获到文本框对象
var winname = window.open('', "_blank", ''); //打开一个新窗口
winname.document.open('text/html', 'replace'); //replace 新文档覆盖历史列表里的当前文档
winname.opener = null // 防止代码对弹出页面修改
winname.document.write(box.value); //把代码框里的值写入到该窗体
winname.document.close(); //关闭文档操作
}
使用时调用runCode(obj)函数, 并且将文本框的id属性值传入. 然后给按钮或者超链接加上事件句柄去激活该函数, 就可以将文本框里的代码在新建的窗口中运行出来.
window.open方法详解:
语法:
以下为引用的内容:
oNewDoc=document.open(sURL,sName)
参数:
sUrl:必选项。字符串(String)。当打开一个新的文档(document)时,此参数用于指定文档(document)的多用途网际邮件扩充协议(MIME - Multipurpose Internet Mail Extensions)。默认值为 text/html 。目前此方法仅支持此种 MIME 类型。
sName :可选项。字符串(String)。当打开一个新的文档(document)时,指定此参数值为 replace,则新文档会覆盖掉历史列表里的当前文档。忽略此参数则新文档被简单的添加到历史列表的最后。replace:新文档覆盖历史列表里的当前文档。
返回值:
oNewDoc:对象(Element)。返回对新的 document 对象的引用。
说明:
打开新文档为 write 和 writeln 的输出做准备。
当文档内的对象上的事件( event )激发的函数调用 open 方法时, window 对象的 open 方法被使用。而当文档内的对象上的事件( event )直接使用 open 方法时, document 对象的 open 方法被使用。