Search code examples
javascriptjqueryhtmlpre

Using <pre> and <code> tags to display a javascript script

I'm experimenting with the < pre> and < code> tags in html 5 as I would like to include some code snippets on my website. I'm using the page below as a test page but it is not displaying anything. Any reason why?

    <body>
    <div style="color:#000000">
      <pre>
        <code>
          <script type="text/javascript">
            $('#inputField').hide();
          </script>
        </code>
      </pre>
    </div>
    </body>

It was my understanding that using these new tags would negate any code that they contain within however this does not appear to be the case.

Cheers,

J

Solution

  • These tags are only for "decorational" purposes. Code within will still be executed. If you want it displayed you have to convert at least the <script> tag to html:

    &lt;script type="text/javascript"&gt;

    Then the JavaScript code inbetween will be shown.

    You don't need both though, I would use <pre> (which is per default a block element), <code> is intended for inline use.