CODEWITHSUNDEEP
javascripthtml
Computings
Computings

Reputation: 119

How to change CSS of one page from another page using JavaScript

I have two web pages:

pageone.html and pagetwo.html

In pageone.html, there is a button with an id of change-color When you click that button, the background color of pagetwo.html is supposed to turn green. But that isn't happening. Can someone help me?

function changeColor() {
  //code

  var pageTwo = 'pagetwo.html';
  pageTwo.style.backgroundColor = "green";
}
<button type="button" id="change-color" onclick="changeColor">Change Background Color</button>

Upvotes: 1

Views: 961

Answers (1)

Jeswin Rebil
Jeswin Rebil

Reputation: 460

You can try like below

In pageone.html

 window.localStorage.setItem("bg", "")
 function changeColor() {
         window.localStorage.setItem("bg", "green");
 }

In pagetwo.html

<script>
var bg = window.localStorage.getItem("bg");
if(typeof bg!= 'undefined' && bg != ""){
    //Set your background using bg variable
}
</script>

Upvotes: 3

Related Questions