Using Javascript To Hide HTML Code

Let me first start off by stating that I did NOT want to steal this gentleman’s code. I was simply viewing the source of a web template that he was selling to see how clean the markup was written and to examine the floats and CSS, etc.

But when I viewed the source for the page linked below, it appears that he is using JavaScript to write the HTML from a bunch of gobble-de-gook. I am assuming that it has been encrypted so that people like me cannot view the source in any way, shape or form.

This brings me to my question… how did he do it? How can I do this to my sites? Can someone take a look at the link below and submit a response on what it is that he has done to hide the HTML and also how I can recreate this technique?

LINK-
http://www.bitpublimedia.ro/themeforest/resume/

Thanks in advance!
Todd

Actually, you probably did write the code and that gentleman stole it, and then you got amnesia.

You probably should get a lawyer and force him to give it back.

He’s just run his normal body content through the escape function.

It does no good escaping it though, anyone can use their web browser console to paste in the command to unencode the stuff, which results in getting:


div id="cv">
		<!-- // ABOUT ME /////////////////////////////////////////////////////////////////// -->
		<div class="cv-section first-cv-section fixed">
			<div class="person">

<!-- SNIP -->

      </fieldset>
    </form><!-- end #contact-form -->
  </div><!-- end .panel -->
  <br />
  <br />
  <a class="emailme" href="#">Email Me</a>

I’ve snipped out most of the page, but you get what I mean.

Where JavaScript is concerned, it is impossible to hide the HTML code.

After reading everything here, I was quite intrigued.

I’ve had a quick glance around with Google, and it seems there are lots of tools out there (heres one) to encrypt your code, however as pmw57 said, it’s easy to get to the actual code.

I used the Web Developer toolbar in firefox, ‘View Generated Source’, and it’s all there for the taking!

I just realised right now that in Google Chrome from the built-in Developer Tools you can right-click on any element node and edit or copy as HTML. Neat!

If you want to find Developer Tools in Google Chrome, there are a number of ways, including:

right-clicking on the page and selecting Inspect Element
or, by using Ctrl+Shift+I
or, by going to Tools -> Developer -> Developer Tools