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

javascript jquery html pre
jezzipin picture jezzipin · Jul 26, 2013 · Viewed 15.8k times · Source

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

Answer

Gerald Schneider picture Gerald Schneider · Jul 26, 2013

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.

Related questions

Simple HTML Pretty Print

http://jsfiddle.net/JamesKyle/L4b8b/ This may be a futile effort, but I personally think its possible. I'm not the best at Javascript or jQuery, however I think I have found a simple way of making a simple …

Read More
How do I check whether a checkbox is checked in jQuery?

I need to check the checked property of a checkbox and perform an action based on the checked property using jQuery. For example, if the age checkbox is checked, then I need to show a textbox to enter age, else …

Read More
How can I know which radio button is selected via jQuery?

I have two radio buttons and want to post the value of the selected one. How can I get the value with jQuery? I can get all of them like this: $("form :radio") How do I know which one is …

Read More