超简单实现JavaScript在线编译器

编程知识 行业动态 更新时间:2024-06-13 00:18:04

又拿菜鸟教程的在线编译器说事儿,好尴尬啊,一个下午写了三个

js的编译其实很简单只需要用到 iframe 和 textarea 标签

这是超简单实现,所以代码很少:

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <textarea rows="10" cols="35" id="inputdata"></textarea>
        <button id="rundata" οnclick="rundata()">RUN</button>
        <iframe id="iframe1"></iframe>  
    </body>
        <script type="text/javascript">
            function rundata(){
                //获取输入框内的数据
                var text = document.getElementById('inputdata').value;
                // 先清空iframe
                var iframe = document.getElementById("iframe1").contentWindow.document.body.innerText = "";
                //将输入框内的数据传给iframe
                iframe = document.getElementById('iframe1').contentDocument.write(text);
               }
        </script>
</html>

效果:


更多推荐

超简单实现JavaScript在线编译器

本文发布于:2023-03-26 06:11:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/cda1573bfcc1ae0a7daa8337a2548144.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:在线   编译器   简单   JavaScript

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!