Convert an Entire HTML Page to a Single JavaScript String

Question

I need to turn an entire HTML document into one, valid JavaScript string.

This is a process that will need to be done regularly. For example:

This:

<html>
    <!--here is my html-->
    <div id="Main">some content</div>
    </html>

needs to become this:

var htmlString="<html><!--here is my html --><div id=\"Main\">some content</div><html>"

Based on what I've ready my initial thought is to read the contents of the file with Java and write my own parser. I don't think this would be possible with a shell script or the like? (I'm on OSX)

Can someone recommend a good approach?

Similar Questions I've Read
Reading entire html file to String?
convert html to javascript

I'm familiar with Java, but open to suggestions. Dev environment is OSX. Whatever the most expedient process would be to convert one file (html) to another (js) where the JS file contains only var stringName="<escaped html>" — Paul
– Paul, Commented Mar 13, 2014 at 11:45
Btw., the string you have shown is not an identical representation of the document shown, because you left out white space (and this can be significant). — C3roe
– C3roe, Commented Mar 13, 2014 at 11:48
Your questions says to use java, but not tagged with 'java' do you mean javascript or java ? - If 'java' tag as java — Rob Sedgwick
– Rob Sedgwick, Commented Mar 13, 2014 at 11:48
And the easiest way would probably be not to bother with writing any “parsers” or such at all – but just take the whole document content you read and encode it as JSON. — C3roe
– C3roe, Commented Mar 13, 2014 at 11:49

Community · Accepted Answer · 2020-06-20 09:12:55Z

4

Try this live, jsFiddle

JS

var htmlString = document.getElementsByTagName('html')[0].innerHTML;
console.log(htmlString);

HTML

<p>Hello</p>
<div>Hi div</div>

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Mar 13, 2014 at 11:54

Jaykumar Patel

27.7k12 gold badges79 silver badges76 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Latheesan · Accepted Answer · 2014-03-13 11:46:38Z

1

How about a jQuery GET request?

e.g.

$.get( "http://www.domain.com/some/page.html", function( data ) {
    // data == entire page in html string
});

It will work on php script also (resulting html output that is).

Alternatively, if you want to achieve this PHP, something like this will also work:

<?php

$html_str = file_get_contents('http://www.domain.com/some/page.html');

?>

answered Mar 13, 2014 at 11:46

Latheesan

24.1k34 gold badges113 silver badges212 bronze badges

1 Comment

Konstantino Sparakis Over a year ago

Although this solution is correct there is no need to have to make another network request when there is methods of getting it via the dom.

Collectives™ on Stack Overflow

Convert an Entire HTML Page to a Single JavaScript String

2 Answers 2

Try this live, jsFiddle

JS

HTML

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Try this live, jsFiddle

JS

HTML

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related