当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 在Z-Blog中运行代码[html][/html](纯JS版)

Javascript
javascript下操作css的float属性的特殊写法
javascript之DIV拖动类 支持在FF下拖动,调用简单
Expandable "Detail" Table Rows
用javascript实现给出的盒子的序列是否可连为一矩型
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
JS创建优美的页面滑动块效果 - Glider.js
发一个比较漂亮的选项卡动态增删的效果
可多次使用的仿126邮箱选项卡的源码
javascript仿XP关机效果的弹出窗口功能
JS控制CSS样式的方法
非常漂亮的JS代码经典广告
推荐自用 Javascript 缩图函数 (onDOMLoaded)……
几个不错的自动收缩菜单导航效果
iframe src为图片时的高度自适应的代码
论坛转贴工具中用到的正则表达式学习正则的好例子
用javascript实现的不错的一款网页选项卡
摘自百度的图片轮换效果代码
用javascript实现旋转图片效果的代码
javascript 制作坦克大战游戏初步 图片与代码
比较简单的jquery教程 Easy Ajax with jQuery 中文版全集

Javascript 中的 在Z-Blog中运行代码[html][/html](纯JS版)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-12   浏览: 189 ::
收藏到网摘: n/a

昨天的《利用th,colgroup,col定义表格样式》中,细心点的朋友会发现加了一个“运行代码”的链接:直接点击可以运行Textarea中的内容。其实本身蓝色理想、51JS上也有相关介绍,Z-Blog官方论坛上也有类似帖子,因为自己不太喜欢改asp的内容(将来升级省得替换),所以偷了个小懒,做了一个纯JS版本的。
是否兼容FireFox,还没来得及测试。自己觉得“另存为”和“复制”功能也比较多余,这里也省略掉了。如果需要Fix Bug或者技术支持,欢迎给我留言^_^ 具体代码如下:
复制代码 代码如下:

function RunCode() {
var ele = document.getElementsByTagName("textarea");
for (var i=0; i<ele.length; i++) {
with (ele[i]) {
if (className != "code") continue;
var o = document.createElement("p");
var a = document.createElement("a");
var em = document.createElement("em");
o.className = "runCode";
a.href = "javascript:;";
a.innerHTML = "运行代码";
a.onclick = function() {
var win = window.open('', "_blank", '');
win.document.open('text/html', 'replace');
win.document.writeln(this.parentNode.previousSibling.value.replace(/\u00a0/gi, " "));
win.document.close();
}
em.innerHTML = "(提示:您可以先修改部分代码再运行)";
o.appendChild(a);
o.appendChild(em);
insertAdjacentElement("afterEnd",o);
}
}
}

目前“运行代码”功能是放在Textarea下方的,如果想放在上方,改动以下代码即可。
insertAdjacentElement("afterEnd",o);
this.parentNode.previousSibling.value
其中的replace(/\u00a0/gi, " ")主要是为了将被c_function.asp文件替换的空格( )和Tab( )还原回来。使用方面当然是在所需页面onload进来即可,有多少个className为code的Textarea,就有多少个“运行代码”功能,够简单吧?