$(function() { /* 获得整个页面可被运行的代码片断*/ var code = $(‘.can_run‘); /*为每个can_run的代码区域添加按钮并绑定事件*/ code.each(function() { var button = $(‘<button class="runcode">运行上面的代码</button>‘), //按钮 p = $(‘<p style="text-align:right;"></p>‘), //按钮加入到段落中 $this = $(this); //保存当前代码区域的引用 /*组织结构，并在can_run之后添加这个结构*/ p.append(button); $this.after(p); /*为当前代码片段对应的按钮绑定点击事件*/ button.on(‘click‘, function() { var win = window.open(‘‘, ‘_blank‘, ‘‘); //开启新窗口 win.document.write( $this.text() ); //向新窗口输出内容 }); }); });
1、直接将上面这段代码用.js方式保存到本地，然后上传到你的博客园后台。【操作路径：管理 >> 文件 >> 选择文件并上传】
2、在博客设置里加入对这个JS文件的引用【操作路径：管理 >> 设置 >> 页首HTML代码】
<script src="你上传的js文件路径"></script>
完成之后就是下面的效果：
<div class="code">
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>为行博客园中的代码添加一个运行代码按钮</title>
</head>
<body>
<h1>Hello, world!</h1>
</body>
</html>
</div>
原文：https://www.cnblogs.com/hollows/p/12896249.html