专注于WEB技术的IT博客

网页中运行代码的实现方法

时间:2013-02-28分类: 网络文摘浏览:5980
分享到:

经常我们为了找一些JS特效,看到代码但却不知道代码运行的结果是怎样的,还好,好多JS内容的网站为我们提供了网页代码运行的功能,只需把要运行的代码放在运行的代码区域 点击运行按纽就会看到运行效果,是不是很方便呢?其实这个功能不难,你也可以实现!


下面的网页运行代码功能的代码来自网络,原创网站域名已经注销,经测试代码功能完整且简单易懂,现分享学习。

先上效果图:


<html>    
<head>    
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">    
<title>启步网网络、IT(挨踢)职业游民学习娱乐之家.</title>    
<script type="text/javascript" language="javascript" >   
//运行文本域代码    
function Preview(obj) {    
var TestWin=window.open('','',''); //打开一个窗口并赋给变量TestWin。    
TestWin.opener = null // 防止代码对论谈页面修改    
TestWin.document.write(obj.value); //向这个打开的窗口中写入代码code,这样就实现了运行代码功能。    
TestWin.document.close();    
}    
//复制文本域代码    
function copyCode(obj) {    
var rng = document.body.createTextRange();    
rng.moveToElementText(obj);    
rng.scrollIntoView();    
rng.select();    
rng.execCommand("Copy");    
rng.collapse(false);    
}    
//另存文本域代码    
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','','启步网,网络、IT(挨踢)职业游民学习娱乐之家.htm');    
winname.close();    
}    
//收藏本页代码    
function addBookmark(title,url) {    
if (window.sidebar) {    
window.sidebar.addPanel(title, url,"");    
} else if( document.all ) {    
window.external.AddFavorite(url,title);    
} else if( window.opera && window.print ) {    
return true;    
}    
}    
</script>   
</head>    
<BODY leftMargin=0 marginwidth="0" >    
<TEXTAREA id=code1 style="WIDTH: 560px; HEIGHT: 200px">    
这里是你想运行的代码区域    
</TEXTAREA>    
<BR><BUTTON onclick=Preview(code1)>运行代码</BUTTON><BUTTON 
onclick=copyCode(code1)>复制代码</BUTTON><BUTTON 
onclick=saveCode(code1)>另存代码</BUTTON><BUTTON 
onclick=addBookmark(document.title,location.href)>收藏本页</BUTTON>    
</body>    
</html>



猜你喜欢
标签 : 运行代码
除非注明,本文首发网志博客,欢迎转载!转载请注明本文地址:http://w3note.com/web/84.html,谢谢。
  • 评论
  • 赞助本站