请选择 进入手机版 | 继续访问电脑版

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

[复制链接]
tianya 发表于 2016-12-21 20:36:19 | 显示全部楼层 |阅读模式
经常我们为了找一些JS特效,看到代码但却不知道代码运行的结果是怎样的,还好,好多JS内容的网站为我们提供了网页代码运行的功能,只需把要运行的代码放在运行的代码区域 点击运行按纽就会看到运行效果,是不是很方便呢?其实这个功能不难,你也可以实现!

先上效果图:
<html>   
  1. <head>
  2. <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
  3. <title>网页中运行代码的实现方法 | 潘军伟博客</title>
  4. <script type="text/javascript" language="javascript" >
  5. //运行文本域代码
  6. function Preview(obj) {
  7. var TestWin=window.open('','',''); //打开一个窗口并赋给变量TestWin。
  8. TestWin.opener = null // 防止代码对论谈页面修改
  9. TestWin.document.write(obj.value); //向这个打开的窗口中写入代码code,这样就实现了运行代码功能。
  10. TestWin.document.close();
  11. }
  12. //复制文本域代码
  13. function copyCode(obj) {
  14. var rng = document.body.createTextRange();
  15. rng.moveToElementText(obj);
  16. rng.scrollIntoView();
  17. rng.select();
  18. rng.execCommand("Copy");
  19. rng.collapse(false);
  20. }
  21. //另存文本域代码
  22. function saveCode(obj) {
  23. var winname = window.open('', '_blank', 'top=10000');
  24. winname.document.open('text/html', 'replace');
  25. winname.document.writeln(obj.value);
  26. winname.document.execCommand('saveas','','启步网,网络、IT(挨踢)职业游民学习娱乐之家.htm');
  27. winname.close();
  28. }
  29. //收藏本页代码
  30. function addBookmark(title,url) {
  31. if (window.sidebar) {
  32. window.sidebar.addPanel(title, url,"");
  33. } else if( document.all ) {
  34. window.external.AddFavorite(url,title);
  35. } else if( window.opera && window.print ) {
  36. return true;
  37. }
  38. }
  39. </script>
  40. </head>
  41. <BODY leftMargin=0 marginwidth="0" >
  42. <TEXTAREA id=code1 style="WIDTH: 560px; HEIGHT: 200px">
  43. 这里是你想运行的代码区域
  44. </TEXTAREA>
  45. <BR><BUTTON onclick=Preview(code1)>运行代码</BUTTON><BUTTON
  46. onclick=copyCode(code1)>复制代码</BUTTON><BUTTON
  47. onclick=saveCode(code1)>另存代码</BUTTON><BUTTON
  48. onclick=addBookmark(document.title,location.href)>收藏本页</BUTTON>
  49. </body>
  50. </html>
复制代码







回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|星辰生活网

© 2001-2013 Comsenz Inc.All Rights Reserved.

Powered by Discuz! X3.2

快速回复 返回顶部 返回列表