在Z-Blog中运行代码[html][/html]（纯JS版）_javascript技巧-js tutoriel-php.cn

在Z-Blog中运行代码[html][/html]（纯JS版）_javascript技巧

WBOY

Libérer： 2016-05-16 19:16:00

original

1188 Les gens l'ont consulté

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

复制代码代码如下:

function RunCode() {  
  var ele = document.getElementsByTagName("textarea");  
  for (var i=0; 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，就有多少个“运行代码”功能，够简单吧？