JS实现直接运行html代码的方法


Posted in Javascript onMarch 13, 2017

本文实例讲述了JS实现直接运行html代码的方法。分享给大家供大家参考,具体如下:

1、实例代码:

<!DOCTYPE html>
<html>
  <head>
    <meta charset='utf-8'/>
    <title>直接运行 html 代码</title>
  </head>
  <body>
    <textarea style='width:300px;height:200px;' id='txtCode'></textarea><br/>
    <input type='button' value='直接运行' id='btnRun'/>
    <script>
      document.getElementById('btnRun').onclick = function(){
        var runHtml = document.getElementById('txtCode').value;
        if(runHtml){
          var win = window.open('', '运行窗口');
          win.document.open();
          win.document.write(runHtml);
          win.document.close();
        }
        else{
          alert('请输入!');
        }
      }
    </script>
  </body>
</html>

2、运行效果图如下:

JS实现直接运行html代码的方法

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Flash+XML滚动新闻代码 无图片 附源码下载
Nov 22 Javascript
理解Javascript_06_理解对象的创建过程
Oct 15 Javascript
JavaScript使用位运算符判断奇数和偶数的方法
Jun 01 Javascript
jQuery实现带滑动条的菜单效果代码
Aug 26 Javascript
JSONObject使用方法详解
Dec 17 Javascript
仅30行代码实现Javascript中的MVC
Feb 15 Javascript
基于JS代码实现图片在页面中旋转效果
Jun 16 Javascript
微信小程序 标签传入数据
May 08 Javascript
AngularJS集合数据遍历显示的实例
Dec 27 Javascript
在vue项目中,使用axios跨域处理
Mar 07 Javascript
页面点击小红心js实现代码
May 26 Javascript
vue elementUI tree树形控件获取父节点ID的实例
Sep 12 Javascript
js从输入框读取内容,比较两个数字的大小方法
Mar 13 #Javascript
jsonp跨域请求实现示例
Mar 13 #Javascript
使用openSpeDiv方法实现Ecshop登录弹窗框效果
Mar 13 #Javascript
H5实现中奖记录逐行滚动切换效果
Mar 13 #Javascript
jQuery实现页面倒计时并刷新效果
Mar 13 #Javascript
JS实现的简单拖拽功能示例
Mar 13 #Javascript
jQuery中layer分页器的使用
Mar 13 #Javascript
You might like
将PHP作为Shell脚本语言使用
2006/10/09 PHP
PHP学习资料汇总与网址
2007/03/16 PHP
php通过数组实现多条件查询实现方法(字符串分割)
2014/05/06 PHP
2个Codeigniter文件批量上传控制器写法例子
2014/07/25 PHP
PHP安全上传图片的方法
2015/03/21 PHP
javascript拓展DOM操作 prependChild insertAfert
2010/11/17 Javascript
JavaScript判断一个URL链接是否有效的实现方法
2011/10/08 Javascript
Javascript实现简单的富文本编辑器附演示
2014/06/16 Javascript
JS打开新窗口防止被浏览器阻止的方法
2015/01/03 Javascript
深入探究JavaScript中for循环的效率问题及相关优化
2016/03/13 Javascript
Javascript基础知识盲点总结之函数
2016/05/15 Javascript
Angular JS数据的双向绑定详解及实例
2016/12/31 Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
2018/01/16 Javascript
代码详解JS操作剪贴板
2018/02/11 Javascript
JS中利用FileReader实现上传图片前本地预览功能
2018/03/02 Javascript
vue项目webpack中Npm传递参数配置不同域名接口
2018/06/15 Javascript
vue解决一个方法同时发送多个请求的问题
2018/09/25 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
vue实现百度下拉列表交互操作示例
2019/03/12 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
2019/12/06 Javascript
在vue中使用echarts(折线图的demo,markline用法)
2020/07/20 Javascript
JS+CSS实现动态时钟
2021/02/19 Javascript
[40:13]Ti4 冒泡赛第二天 iG vs NEWBEE 2
2014/07/15 DOTA
python类定义的讲解
2013/11/01 Python
python 遍历目录(包括子目录)下所有文件的实例
2018/07/11 Python
Python 中 function(#) (X)格式 和 (#)在Python3.*中的注意事项
2018/11/30 Python
python装饰器代替set get方法实例
2019/12/19 Python
Python如何对齐字符串
2020/07/30 Python
Python实现Appium端口检测与释放的实现
2020/12/31 Python
应聘会计求职信
2014/06/11 职场文书
信仰纪录片观后感
2015/06/08 职场文书
结婚主持人致辞
2015/07/28 职场文书
新店开业策划方案怎么书写?
2019/07/05 职场文书
Pytorch 如何加速Dataloader提升数据读取速度
2021/05/28 Python
JavaScript组合继承详解
2021/11/07 Javascript
pnpm对npm及yarn降维打击详解
2022/08/05 Javascript