CodeMirror 2 – Highlight only (no editor)

Can CodeMirror 2 be used to highlight code from a DIV or PRE tag (without the editor)?

Like CodeMirror 1 used to be able to do with the hightlightText() function? For example here: http://codemirror.net/1/highlight.html, after you press run highlight (the highlighted text below)

Also can it highlight code from a inline element, like <code>, and keep the results inline, like Google’s Prettify does?

Answer

A much nicer and easier solution is to just set the readOnly property of the CodeMirror instance to true, like this:

$('.code').each(function() {

    var $this = $(this),
        $code = $this.html();

    $this.empty();

    var myCodeMirror = CodeMirror(this, {
        value: $code,
        mode: 'javascript',
        lineNumbers: !$this.is('.inline'),
        readOnly: true
    });

});

Just add the class .code to the tag containing the code and it will be syntax highlighted. I’ve also added support for inline code, by using the class .inline.

Example on jsfiddle