0

google-prettifyといくつかのjQueryを使用して、構文の強調表示をTumblrブログに含めようとしています。

Google-prettify<pre>構文を強調するために要素にクラスが必要prettyprintですが、マークダウンを使用してTumblr投稿を作成しているため、<pre>要素にクラスを追加できません。

私の解決策は、このjQueryスニペットを使用してprettyprintクラスを<pre>要素に追加することです。

<script type='text/javascript'>
$(document).ready(function() {
      $('pre').addClass('prettyprint');
      prettyPrint();
});
</script>

これは正常に機能していますが、コードスニペットを投稿するたびにすべて<を変換するのではなく、Tumblrに表示するコードをコピーして貼り付けることができるようにしたいと思います。&lt;>&gt;

<jQueryを使用して、すべてのとを対応するhtmlコードに置き換えたいのですが、要素>内のみです。ただし、コードがプリティファイさpreれる前にすべてを置き換える必要があるため、これにはいくつかの問題がある可能性があります。

新しいクラスを追加し、タグを置き換えてから、呼び出しprettyPrint();てすべてを初期化できますか？または、コードを投稿する前に、HTML文字を手動でHTMLエンティティに変更する必要がありますか？

少し更新： このスクリプトは、、、および..を除いて、<およびを変更することで機能します。><body><html><head>

<script type='text/javascript'>
$(function() {
   var $pre = $('pre');
   $pre.html($pre.html().replace(/</g, 'f').replace(/>/g, 'l'));
});
</script>

<pre>
    <html></html>
    <body></body>
    <head><head>
    <i></i>
</pre>

注：fコードをテストするためだけに代わりに使用しました。

4

1 に答える 1

0

最初にすべてのアンパサンドをエンティティに置き換え、次に小なり記号に置き換えると、返された文字列を、のテキストノード<pre>、または空白が「pre」に設定された任意のブロックコンテナとして使用できます。

function stripX(str){
    return str.replace(/\&(?!(\w+;))/g, '&amp;').replace(/</g, '&lt;');
}
于 2012-06-14T03:32:34.533 に答える