SyntaxHighlighter 3.0.83 使用上の注意_JavaScript スキル

1. ダウンロード

SyntaxHighlighter 3.0.83: http://alexgorbatchev.com/SyntaxHighlighter

2. 構成

(1) SyntaxHighlighter によって解析されるデフォルトのタグ。デフォルトは pre

です。

コードをコピーします コードは次のとおりです:

SyntaxHighlighter.config.tagName="div";

(2) HTML の改行タグを削除
ソフトウェアが各行の末尾に shCore.js の実装コードは次のとおりです:

コードをコピーします コードは次のとおりです:

If (sh.config.stripBrs == true)
str = str.replace(br, '');
SyntaxHighlighter.config.stripBrs=true;

(3) ツールバーを表示しない

コードをコピーします コードは次のとおりです:

SyntaxHighlighter.defaults['ツールバー'] = false;

3. コード内で

を使用します。

3.1 ブラシは必須ですが、残りはオプションです:

コードをコピーします コードは次のとおりです:

一部の Java コード

ブラシ値: java/xml/sql/c/js/css など。詳細については、次を参照してください: http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/

3.2 シェーディング呼び出し:

コードをコピーします コードは次のとおりです:

SyntaxHighlighter.highlight();

または

コードをコピーします コードは次のとおりです:

SyntaxHighlighter.all();

all() とhighlight() の違いは、all() が onload() イベントに登録されることです。

4. ブログガーデンでの使用

Blog Park はデフォルトで SyntaxHighlighter をサポートしています。デフォルト値を変更するコード (jQuery は !payment スタイルの設定をサポートしていないため、cssText を設定する必要があります):

コードをコピーします コードは次のとおりです:

var sh = $(".syntaxhighlighter");
var code = sh.find("code");
var line = sh.find(".line");
var caption = sh.find("表のキャプション");
sh.css("cssText", "width: auto ! important");
コード.add(行)
.add(caption)
.css("cssText", "font-size: 20px ! important;white-space: nowrap ! important;line-height: 1.5em ! important;");

上記がこの記事の全内容です。SyntaxHighlighter の使用方法について新たに理解できたでしょうか。この記事を気に入っていただければ幸いです。