<!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. 我的GTD中收集的书单

    在几年的GTD过程中,收集了一些想读的书目,没有系统地整理,每当读完一本之后,就翻翻书单,寻找下一本感兴趣的书,书是不可能读完的,只能找有兴趣的.符合自己目标方向的.有些书记录了豆瓣上的评分,虽然不是 ...

  2. Sharepoint学习笔记—习题系列--70-573习题解析 -(Q22-Q24)

    Question22You create a Feature.You need to remove the link to the Site Content Type page from the Si ...

  3. STL--双端队列（deque）和链表（list）

    双端队列(deque容器类): #include<deque>与vector 类似,支持随机访问和快速插入删除,它在容器中某一位置上的操作所花费的是线性时间. 与vector不同的是:de ...

  4. 一个线程加一运算，一个线程做减一运算，多个线程同时交替运行--synchronized

    使用synchronized package com.pb.thread.demo5; /**使用synchronized * 一个线程加一运算,一个线程做减法运算,多个线程同时交替运行 * * @a ...

  5. Git使用之设置SSH Key

    设置SSH Key 1.    检查是否已经有SSH Key. $cd ~/.ssh 如果说没有这个目录,就直接看第三步 2.    备份 3.    生成一个新的SSH. $ssh-keygen - ...

  6. Node.js（2）-protobuf zeromq gzip

    1.Node.Js环境准备 在win8 + vs.net 2012 环境下调试了很长时间没搞定安装编译问题,重装系统测试了2套环境,解决了编译问题: 1)Win8.1 + vs.net 2013 2) ...

  7. 05_最长公共子序列问题(LCS)

    问题来源:刘汝佳<算法竞赛入门经典--训练指南> P60 问题7: 问题描述:给两个子序列A和B,求长度最大的公共子序列.比如1,5,2,6,8,和2,3,5,6,9,8,4的最长公共子序 ...

  8. html弹窗半透明

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="C ...

  9. ejabberd常见配置说明

    1.数据库配置 ejabberd默认安装后使用的是自带的数据库,可以通过配置使用其他的数据库如Mysql.Sqlserver.Postgresql等数据库,Mysql数据库配置参见<Linux下 ...

  10. [学习嵌入式开发板]iTOP-4412实现NFS网络文件系统

    本文转自迅为:http://www.topeetboard.com 学习平台:iTOP-4412开发板 本文讲解如何在 iTOP-4412 开发板上实现 NFS 网络文件系统. 我们使用的软硬件环境是 ...