<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>在线运行Javascript,Jquery,HTML,CSS代码</title>

<script type="text/javascript">

var userAgent = navigator.userAgent.toLowerCase();

var is_webtv = userAgent.indexOf('webtv') != -1;

var is_kon = userAgent.indexOf('konqueror') != -1;

var is_mac = userAgent.indexOf('mac') != -1;

var is_saf = userAgent.indexOf('applewebkit') != -1 || navigator.vendor == 'Apple Computer, Inc.';

var is_opera = userAgent.indexOf('opera') != -1 && opera.version();

var is_moz = (navigator.product == 'Gecko' && !is_saf) && userAgent.substr(userAgent.indexOf('firefox') + 8, 3);

var is_ns = userAgent.indexOf('compatible') == -1 && userAgent.indexOf('mozilla') != -1 && !is_opera && !is_webtv && !is_saf;

var is_ie = (userAgent.indexOf('msie') != -1 && !is_opera && !is_saf && !is_webtv) && userAgent.substr(userAgent.indexOf('msie') + 5, 3);

function $(id) {

return document.getElementById(id);

}

function copyCode(obj) {

if(is_ie && obj.style.display != 'none') {

   var rng = document.body.createTextRange();

   rng.moveToElementText(obj);

   rng.scrollIntoView();

   rng.select();

   rng.execCommand("Copy");

   rng.collapse(false);

}

}

function runCode(obj) {

var winname = window.open('', "_blank", '');

winname.document.open('text/html', 'replace');

winname.document.write(obj.value);

winname.document.close();

}

function saveCode(obj) {

var winname = window.open('', '_blank', 'top=10000');

winname.document.open('text/html', 'replace');

winname.document.writeln(obj.value);

winname.document.execCommand('saveas','','code.htm');

winname.close();

}

</script>

</head>

<body onkeydown="if(event.keyCode==27) return false;">

<span>请在下面输入 HTML 代码段</span><p>

<textarea id="code0" rows="30" cols="160">

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>在线运行</title>

<style>

</style>

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

<head>

<body>

  <div>这儿为页面内容</div>

<script type="text/javascript">

$(document).ready(function(e) {

	//这儿加载页面加载完成后执行的代码

});

</script>

</body>

</html>

</textarea><p>

<input type="button" value="运行代码" onclick="runCode($('code0'))"> 

<input type="button" value="复制代码" onclick="copyCode($('code0'))"> 

<input type="button" value="另存代码" onclick="saveCode($('code0'))"> 

提示：您可以修改上面部分代码后再重新运行

</body></html>

　　

在线运行Javascript,Jquery,HTML,CSS代码的更多相关文章

  1. JavaScript/Jquery返回顶部代码

    <!DOCTYPE html> <html> <head> <title>返回顶部</title> <meta charset=&qu ...

  2. jQuery结合CSS实现手风琴组件(2)----利用seajs实现静态资源模块化引入

    1. 目录结构(webStrom) 2. 代码 1.html <!DOCTYPE html> <html lang="en"> <head> & ...

  3. 【前端】javascript+jQuery实现旋转木马效果轮播图slider

    实现效果: 实现原理: 技术栈: javascript+jQuery+html+css 实现步骤: // 0. 获取元素 // 1. 鼠标放置到轮播图上,显示两侧的控制按钮,移开后隐藏 // 2. 为 ...

  4. 浏览器地址栏运行JavaScript代码

    这个很多人应该还是知道的,在浏览器地址栏可以直接运行JavaScript代码,做法是以javascript:开头后跟要执行的语句.比如: javascript:alert('hello from ad ...

  5. 网页HTML代码在线运行器

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 在线运行HTML代码器

    在线运行HTML代码器(二)和前面的(一)大同小异,关键部分为JS代码,这次是把运行器所有的JS功能集中放在一起.以下为HTML代码: <!DOCTYPE html PUBLIC "- ...

  7. 记录下项目中常用到的JavaScript/JQuery代码二（大量实例）

    记录下项目中常用到的JavaScript/JQuery代码一(大量实例) 1.input输入框监听变化 <input type="text" style="widt ...

  8. jsfiddle在线測试Html、CSS、JavaScript——http://jsfiddle.net/

    jsfiddle在线測试Html.CSS.JavaScript,并展示測试结果 1.选择jQuery1.9.1 2.选择jQuery UI 1.9.2 3.Html <ul id="n ...

  9. jsDelivr - Free open source CDN for javascript libraries, jQuery plugins, CSS frameworks, Fonts and more

    jsDelivr - Free open source CDN for javascript libraries, jQuery plugins, CSS frameworks, Fonts and ...

随机推荐

  1. mac java 环境设置

    MAC下JDK1.6下载路径 http://support.apple.com/kb/DL1572 Mac OS的java版本问题和Eclipse中无法找到jdk源代码的问题解决办法 下载包含源代码j ...

  2. sudo gem install cocoapods 没反应问题

    1. 尝试更新 sudo gem update --system 2. 查看安装详细 sudo gem install cocoapods -V 3.详细使用有个链接 http://blog.csdn ...

  3. IOS中程序如何进行推送消息(本地推送,远程推送)2(上)

    未看过本地推送的,可以提前看一下本地推送. http://www.cnblogs.com/wolfhous/p/5135711.html =============================== ...

  4. App开发流程之Xcode配置和本地化

    补充一点遗漏的Xcode配置. 1.偏好设置.Xcode的菜单栏Xcode -> Preference Fonts & Colors可以自定义编码区和控制台的背景.字体. Text Ed ...

  5. 【原】训练自己haar-like特征分类器并识别物体（2）

    在上一篇文章中,我介绍了<训练自己的haar-like特征分类器并识别物体>的前两个步骤: 1.准备训练样本图片,包括正例及反例样本 2.生成样本描述文件 3.训练样本 4.目标识别 == ...

  6. Android源码分析之Message

    准备开始写点东西,算是对自己阅读源码的一个记录/笔记,也希望能对同样感兴趣的人有所帮助,希望能坚持下去,加油. 在Android的开发中,我们经常用到Handler.postXXX方法,或者View. ...

  7. iOS之UI--通讯录的实例关键知识技术点积累

    通讯录的实例关键知识技术点积累 效果展示: 作为博文笔记,既然是笔记,目的是为了能够以后做这个项目能够快速上手,如果这是我下一次阅览这个博文笔记,那么我应该先空手从零开始做,需求也就是这个项目的展示效 ...

  8. 关于IOS应用程序视图

    积累英语词汇: assemble [ə'semb(ə)l] vt. 集合,聚集:装配:收集 assembled [ə'sembəld] adj. 组合的:安装的 v. 装配(assemble的过去分词 ...

  9. 问题解决——multimap中统计key的种类

    ================声明================= 本文原创,转载请注明出处和作者,并保持文章的完整性. 本文链接:http://www.cnblogs.com/wlsandwho ...

  10. 通过java的Runtime.getRuntime()和System.getProperties()来获取系统的信息

    第一种,通过Runtime.getRuntime()来获取系统信息. 通过java来获取系统以下的信息: 主机名: OS 名称:         OS 版本: OS 制造商: OS 配置: 独立工作站 ...