原理：window.open()方法，open一个新的空白页，然后把文本框中粘贴的代码通过DOM操作，写到新的代码页中，

再利用document.write的功能（写进去之前把其他的全部删掉，并且写进去的html代码是可以解析的。）完成想要的效果。

window.open打开的新页面也是一个浏览器对象，也具有document.write这个方法；。

 <!DOCTYPE html>

 <html>

     <!--

         作者：702004176@qq.com

         时间：2017-04-07

         描述：在线运行代码小工具

     -->

     <head>

         <meta charset="UTF-8">

         <title>在线运行代码</title>

         <meta name="author" content="gjf_xing.org1^"/>

         <meta name="Description" content="在线运行代码的小工具"/>

         <meta name="Keywords" content="小工具，代码运行，运行代码，open方法，新页面，在线调试"/>

     </head>

     <body>

         <textarea name="" rows="13" cols="80" id="txt"></textarea>

         <br />

         <input type="button" name="" id="btn" value="运行代码" />

     </body>

     <script type="text/javascript">

         window.onload = function(){

             var oTxt = document.getElementById("txt"),

                 oBtn = document.getElementById("btn");

             oBtn.onclick = function(){

                 var w = window.open("about:blank","_blank");

                 w.document.write(oTxt.value);

             };

         };

     </script>

 </html>

JS-在线运行代码小工具的更多相关文章

  1. JSON生成c#类代码小工具

    JSON生成c#类代码小工具 为什么写这么个玩意 最近的项目中需要和一个服务端程序通讯,而通讯的协议是基于流行的json,由于是.net,所以很简单的从公司代码库里找到了Newtonsoft.dll( ...

  2. VSS源代码管理器运行代码分析工具的命令

    当你发现代码库总是报需要联系管理员运行代码分析工具时,你可以使用命令分析代码库代码解决: To fix the database problems, you can restart the analy ...

  3. SQL转Java代码小工具

    工作中使用SQL的时候很多,当使用hibernate的时候,经常遇到多行的SQL,通常在PL/SQL或其他地方写好SQL,测试没问题后,需要将SQL写到程序代码中,多行SQL需要拼接字符串,手动一行行 ...

  4. 三个 DAL 相关的Java代码小工具

    最近在做 DAL (Data Access Layer 数据访问层) 的服务化,发现有不少地方是人工编写比较繁琐的,因此写了几个小工具来完成. 1.  从 DAO 类自动生成 CoreService ...

  5. Node.js+Ajax实现物流小工具

    半年过去了,好像什么也没干,好像什么也干了. 最近在网易云课堂上看到了这个课程,觉得很有意思,就跟着课程做了一遍,课程地址:http://study.163.com/course/courseMain ...

  6. 使用uni-app(Vue.js)创建运行微信小程序项目步骤

    使用uni-app(Vue.js)开发微信小程序项目步骤 1. 新建一个uni-app项目   创建完成后的目录结构 2. 打开微信小程序开发工具端的端口调试功能 3. 运行创建的项目 效果

  7. 把调试好的SQL语句转换为JAVA代码小工具

    关键点:Pattern实现SQL拆解.ZeroClipboard.js实现复制到剪切板 主要代码: <%@ page language="java" import=" ...

  8. delphi 利用HTTP的POST方法做个在线翻译的小工具 good

    最近做了一个英汉小翻译的东东,用的是VC,ADO + Access访问数据库,单词数据库是从金山打字通2002弄来的.后来想了想,想再加个在线翻译的功能,记得经常使用GOOGLE翻译网站的在线翻译,也 ...

  9. arcgis api for js 4.4 绘图小工具

    目前在4.x API中还未有官方的绘图工具,而实际项目中又需要这样的绘图工具,所以自己写了一个.  奉上代码. 使用方法:1.将引入的API模块传入构造函数 var drawTools = new D ...

随机推荐

  1. pthread_join直接决定资源是否能够及时释放

    /*http://hankjin.blog.163.com/blog/static/33731937201072675024100/ pthread的内存泄露 # cc thread.c -lpthr ...

  2. java中静态方法的使用

    JAVA中使用静态方法 编程时我们心里一定要清楚静态方法和类的非静态方法方法的区别: 最根本区别从编译角度来说吧: 1) 静态(static)方法是编译时直接加载加载到内存中(离cpu最近的一块内存区 ...

  3. 经典SQL回顾之晋级篇

    上篇博文在说SQL基础的时候,有一个地方有点误导大家,文中说到SQL 中的substring()和C#中的substring()相同,这有点歧义.基本原理虽然相同,但是有一点很不一样,就是C#中索引是 ...

  4. CentOS6.5下安装Zabbix

    一.安装环境LAMP 这次安装zabbix全程使用yum进行安装,在于速度快,而且,出错的机会小,如果以后在生产环境上时,也可以先使用可以联网的机器进行安装,安装好以后将机器隔离,这样安装速度更快更方 ...

  5. 6. GC 调优(工具篇) - GC參考手冊

    进行GC性能调优时, 须要明白了解, 当前的GC行为对系统和用户有多大的影响. 有多种监控GC的工具和方法, 本章将逐一介绍经常使用的工具. 您应该已经阅读了前面的章节: 垃圾收集简单介绍 - GC參 ...

  6. mongodb如何查询某个字段多个值的数据

    数据库  python  mongodb 4.9k 次浏览 问题对人有帮助,内容完整,我也想知道答案0问题没有实际价值,缺少关键内容,没有改进余地 如何查询mongodb某个集合里面某一个字段为多个情 ...

  7. Boostrap入门级css样式学习

    1. 自适应网页设计 首先,在网页代码的头部,加入一行 viewport元标签.viewport是网页默认的宽度和高度, <meta name="viewport" cont ...

  8. 不可错过的10个超棒jQuery表单操作代码片段

    jQuery 绝对是一个伟大的开源javascript类库,是帮助我们快速和高效开发前端应用的利器.可能大家在日常的开发过程中常常会处理表单相关的 javascript,在今天这篇代码片段分享文章中, ...

  9. Java获取网络IP

    Java获取获取网络IP,浅尝辄止咯- import java.net.InetAddress; import java.net.UnknownHostException; /** * 获取网络IP ...

  10. 【转】Linux内核源码分析方法

    一.内核源码之我见 Linux内核代码的庞大令不少人“望而生畏”,也正因为如此,使得人们对Linux的了解仅处于泛泛的层次.如果想透析Linux,深入操作系统的本质,阅读内核源码是最有效的途径.我们都 ...