webentwicklung-frage-antwort-db.com.de

Syntaxmarkierungscode mit Javascript

Welche Javascript-Bibliotheken können Sie zur Syntaxhervorhebung von <code> -Blöcken in HTML empfehlen?

(Ein Vorschlag pro Antwort bitte).

106
mlambie

StackOverflow verwendet die Bibliothek Prettify .

103
AaronSieb

Ich habe kürzlich eine mit dem Namen Rainbow entwickelt.

Das Hauptziel des Designs war es, die Kernbibliothek so klein wie möglich zu halten und den Entwicklern das Erweitern zu erleichtern.

Siehe http://rainbowco.de .

45
Craig

SyntaxHighlighter ist als GitHub-Projekt verfügbar.

26
mlambie

Was ist mit Prisma von Lea Verou.

Aus ihrer Blogpost Ankündigung im Juni (2012):

  • Es ist winzig. Der Core ist nur 1,5 KB groß und hat ein GZIP.
  • Es ist unglaublich erweiterbar. Es ist nicht nur einfach, neue Sprachen hinzuzufügen (das ist heutzutage bei jedem Syntax-Textmarker selbstverständlich), sondern auch vorhandene zu erweitern.
  • Es unterstützt Parallelität durch Web Worker, um in bestimmten Fällen eine bessere Leistung zu erzielen.
  • Sie müssen kein Prisma-spezifisches Markup verwenden, nicht einmal einen Prisma-spezifischen Klassennamen, sondern nur das Standard-Markup, das Sie sowieso verwenden sollten. Probieren Sie es einfach eine Weile aus, entfernen Sie es, wenn Sie es nicht mögen, und hinterlassen Sie keine Spuren.
15
Ilya Tuvschev

jQuery Syntax Highlighter ist ein neuer Text, der auf Google's Prettify basiert - einem wirklich sehr sehr beliebten Textmarker mit einfacher Javascript-Syntax.

Es unterstützt solche Dinge wie code und pre Blöcke, die Klassennamen wie language-javascript Verwenden können, um anzuzeigen, dass sie hervorgehoben werden sollen, sowie Zeilenumbrüche. Sie können Code kopieren und einfügen, indem Sie ihn normal auswählen, anstatt wie viele andere eine Rohansicht öffnen zu müssen. Sie kann mithilfe des HTML5-Datenattributs data-sh Oder durch Angabe von Optionen bei der Initialisierung weiter angepasst werden. Eine großartige stabile Wahl, die regelmäßig aktualisiert wird.

15
balupton

Wenn Sie jQuery verwenden, gibt es Chili:

http://code.google.com/p/jquery-chili-js/

Alles, was Sie tun müssen, ist, die Dateien jquery-chili.js und recipes.js einzuschließen und die Hervorhebung mit auszuführen

$("code").chili();

Es sollte die Sprache selbst herausfinden.

5
Edu Felipe

Ich bin sehr zufrieden mit SHJS . Es unterstützt eine Vielzahl von Sprachen und scheint ziemlich schnell und genau zu sein.

Hier ist ein Beispiel, in dem ich es auf meinem Blog verwende. Ich verwende meine eigene benutzerdefinierte CSS-Datei, die die Syntaxhervorhebung Codas simuliert. Schicken Sie mir eine E-Mail, wenn Sie es verwenden möchten.

5
Andrew Hedges
5

jQuery.Syntax ist ein extrem schneller und leichter Syntax-Textmarker. Es hat dynamisches Laden von Syntax-Quelldateien und lässt sich sauber mit CSS oder Modelines integrieren.

Es wurde speziell entwickelt, um eine Lücke zu schließen - das heißt: einen schnellen, sauberen, clientseitigen Syntax-Parser.

4
ioquatix

Wenn Sie in einem Browser-Editor nach Syntaxhervorhebungen suchen, versuchen Sie CodeMirror .

3
rplevy

Ich bin nicht argumentativ, aber ich finde es erwähnenswert, dass wenn Sie ein CMS oder eine Blog-Plattform verwenden, die Verwendung eines Back-End-Textmarkers aus offensichtlichen Gründen besser ist. Schauen Sie sich Geshi ( http://qbnz.com/highlighter/ ) wenn Sie interessiert sind. Eigentlich könnten Sie Ihren Server so einrichten, dass HTML-Inhalte über eine Back-End-Technologie analysiert werden - daher sind die JS-Textmarker überhaupt nicht erforderlich. (Die einzige Funktionalität, die sie hinzufügen, ist die Fähigkeit, [mit swf] zu drucken/kopieren.)

3
James
2
Franci Penov

Dieser Artikel im Web Resources Depot listet eine Reihe von Optionen zum Hervorheben von Code auf, von denen einige Javascript verwenden. Es wurde am 4. Mai 2009 veröffentlicht.

2
mlambie