博客园如何运行代码

<script type="text/javascript"> alert("你知道我是怎么弹出的吗？"); </script>

 

很早以前看到有人在博客园运行代码，直观性好，很想自己也弄个，今天分享下自己的心得。

首先当然需要申请js权限，不然外链的js根本就不会显示在页面上。因为我们这个运行需要用到一些公用的，总不至于说每次运行都要写一遍吧，所以把它作为外链加进来：代码如下，参考别人人的：可以取个名字，我的叫run.js

window.onload = function(){
    var btn = document.getElementById("btn");
    var con = document.getElementById("con");
    if(btn && con){
        btn.onclick = function(){
            var newwin = window.open('', "_blank", '');
            newwin.document.open('text/html', 'replace');
            newwin.opener = null;
            newwin.document.write(con.value);
            newwin.document.close();
        }
    }
}

　　单击博客首页的“管理”，进入管理页面，在管理页面里单击“文件”选项卡，进入，并上传littledu.js文件，上传完毕后单击该文件，复制地址栏的地址，此为该js文件的地址。我的地址是：https://files.cnblogs.com/files/webskill/run.js

 

第二步：在文章中插入代码：

单击如图所示红圈中的HTML按钮：，在弹出的对话框里将以下代码贴上：注意如果有<script>标签,请用字符形式,不要用<  ,>，会被过滤导致js不生效

运行代码如下：

<textarea id="con" style="height: 167px; width: 375px; margin: 2px;"><script type="text/javascript">
alert("你知道我是怎么弹出的吗？");
</script></textarea>
<input value="运行代码" type="button" id="btn" />

注意不要漏掉 textarea的id  和 input的id。

完了,你可以亲自试一下！