1

I am making a webpage, and I have some javascript code for a countdown timer. below the timer, I want to show people the code for the project without forcing them to open developer tools, so I made the following:

<body onload="show()">
    <span id="showCode">
        <!-- where I want my code to show -->
    </span>
    <script>

    function show() {
        document.getElementById('showCode').innerHTML = document.body.innerHTML;
    }

    </script>
</body>

How can I use javascript to show the inner html of an element instead of executing the code?

Mashpoe
  • 504
  • 1
  • 9
  • 27

1 Answers1

0

"You need to convert your < and > characters to HTML entities like so:"

<pre class="prettyprint">
  &lt;script&gt;
    $(document).ready(function(){
      setTimeout(function(){
        console.log('deleting cookie');
        $.cookie('cookie',null,{domain: document.domain});
      },1000);
    });
  &lt;/script&gt;
</pre>

"I would also recommend wrapping the code in <code> tags in addition to the existing <pre> tags."

~ Travis

Display javascript as code snippet

Community
  • 1
  • 1
Dustin Luke
  • 21
  • 2
  • I am not sure if this will work for you or if you are trying to do more then just display the countdown code. – Dustin Luke Dec 11 '15 at 01:21
  • it would work for what I am doing right now, but I wan't to use this code for other purposes. I wan't to be able to set the innerHTML of an element to code as a string. This would be useful for something like a webpage builder that shows the current code for the webpage. – Mashpoe Dec 11 '15 at 01:45