How do I use javascript to change HTML of page

Question

How do I use JavaScript to change the HTML of a webpage? Temporarily, only for the time they are on the webpage I am making a chrome extension to change the 404 that I get at randomsiteisay.com/randomsitepage Pretty much that the unused webpage gets its HTML changed to what I want it to be.

What I have:

var body1 = '\
<div id="header"><h1>Server Error</h1></div>\
<div id="content">\
 <div class="content-container"><fieldset>\
  <h2>Dont go here</h2>\
  <h3>Thats RT, EWW</h3>\
 </fieldset></div>\
</div>\
'

var aNewBodyElement = document.createElement("body");

aNewBodyElement.id = "newBodyElement";
document.body = aNewBodyElement;
document.getElementById("newBodyElement").innerHTML = body1;

score 0 · Answer 1 · answered Mar 02 '15 at 19:48

0

Just replace the last 4 lines by:

document.querySelector("body").innerHTML= body1

answered Mar 02 '15 at 19:48

Gaël Barbin

3,769
3
25
52

score 0 · Answer 2 · edited Mar 02 '15 at 20:01

0

document.getElementById("body").innerHTML = body1;

edited Mar 02 '15 at 20:01

Undo

25,519
37
106
129

answered Mar 02 '15 at 19:57

Igor Monteiro

933
1
11
29

2

Could you please [edit] in an explanation of why this code answers the question? Code-only answers are [discouraged](http://meta.stackexchange.com/questions/148272), because they don't teach the solution. – Scimonster Mar 02 '15 at 20:57

score 0 · Answer 3 · edited May 23 '17 at 11:43

0

To manipulate HTML using javascript just use:

document.getElementById("body"); 
//and then change the background of the body

Or if you want to try jQuery you could do:

$('body').css('background-image', 'url(...)')

might help: Switching a DIV background image with jQuery

edited May 23 '17 at 11:43

Community

1
1

answered Mar 02 '15 at 20:15

pmat

43
6

How do I use javascript to change HTML of page

3 Answers3