test/grammar-xml.html

<!doctype html>
<html>
    <head>
        
        <meta charset="utf-8">
        
        <link rel="stylesheet" href="codemirror/codemirror.css">
        <link rel="stylesheet" href="codemirror/addon/lint/lint.css">
        <link rel="stylesheet" href="codemirror/addon/hint/show-hint.css">
        <link rel="stylesheet" href="codemirror/addon/fold/foldgutter.css" />
        <style type="text/css">
            body {
                position: relative;
            }

            .CodeMirror {
                margin: 0;
                position: relative;
                width: 100%;
                height: 100%;
                min-width:500px;
                min-height:500px;
            }
        </style>
        
        <script src="codemirror/codemirror.js"></script>
        <script src="codemirror/addon/comment/comment.js"></script>
        <script src="codemirror/addon/lint/lint.js"></script>
        <script src="codemirror/addon/hint/show-hint.js"></script>
        <script src="codemirror/addon/fold/foldcode.js"></script>
        <script src="codemirror/addon/fold/foldgutter.js"></script>
        <!--<script src="codemirror/addon/fold/xml-fold.js"></script>
        <script src="codemirror/addon/fold/comment-fold.js"></script>-->
        <script src="../build/codemirror_grammar.js"></script>
        <script src="grammars/xml.js"></script>
        <script src="demo.js"></script>
        
        <title>CodeMirror: Dynamic XML Grammar Demo</title>
    </head>
    <body>
        
        <h3>CodeMirror (v.<span id="editor-version">0</span>) Grammar (v.<span id="grammar-version">0</span>): Dynamic XML Grammar</h3>
<textarea id="code" name="code">&lt;?xml version="1.0" encoding="utf-8"?&gt;
&lt;!doctype html&gt;
&lt;html id="id1" id="id2" style = "color: green"&gt;
    &lt;!-- this is a comment --&gt;
    &lt;head id="id1"&gt;
        &lt;title&gt;HTML Example&lt;/title&gt;
    &lt;/head&gt;
    &lt;body id="id1"&gt;
        &lt;!-- this is a 
            long comment --&gt;
        &lt;div class="divclass"&gt;
            &lt;![CDATA[
                cdata text in here
                &lt;a_tag&gt;, etc..
            ]]&gt;
        &lt;/div&gt;
        The indentation tries to be &lt;em&gt;somewhat &amp;quot;do what
        I mean&amp;quot;&lt;/em&gt;... but might not match your style.
    &lt;/bdy&gt;
    &lt;?xml version="1.0" encoding="utf-8"?&gt;
    &lt;!doctype html&gt;
&lt;/html&gt;
</textarea>
        <p></p>

        <script>
        // <![CDATA[
        codemirror_grammar_demo(document.getElementById("code"), [
             {language : "xml",        grammar : xml_grammar}
        ]);
        // ]]>
        </script>
    </body>
</html>