JSのプラグインでページ内のJavaScriptを強調表示して実行します

Question

私はJSライブラリのドキュメントを書いており、よくコード例を挿入します。私が望むのは、ユーザーがこれらの例を編集したり（RUNボタンなどで）実行できるようにすることです。

誰かがそれを行うことができるlight jsプラグインを知っていますか？ （コードハイライター付き）。

編集：非常にシンプルなWebコンソールのように、JSコードを実行するだけのもので、CSSとHTMLを編集する必要はありません。

Answer 1

Codepenでは、コードサンプルにシンタックスハイライトを埋め込み、サンドボックス環境で実行することができます。

<p data-height="268" data-theme-id="0" data-slug-hash="ClnAe" data-user="afkatja" data-default-tab="result" class='codepen'>See the Pen <a href='http://codepen.io/chriscoyier/pen/ClnAe'>ClnAe</a> by Katja Hollar (<a href='http://codepen.io/afkatja'>@afkatja</a>) on <a href='http://codepen.io'>CodePen</a></p> 

Here's a blog post Codepenからの詳細と：ここ

は（ので、この答えは、コードを持っていないためにフラグが付けられませんが、実際にドキュメントを読み、非常に簡単です）埋め込むためのサンプルコードスニペットですの仕方。

Here's an example of a blog postは、埋め込まれたCodepenを使用します。

編集：コードサンプルを編集可能にしたかっただけです。私はそれがthis blog postに記載されているように、Codepen PROの機能であると思います。おそらくまだオプションですが、無料でそれを行う代替手段があるかもしれません。