Javascript change html or body css

Question

I use in my webpage the css description

    body {
    font-size: 12px;
    font-family: Sans-Serif;
    background: url(images/diffdummy.png) no-repeat center center fixed;
    overflow: hidden;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

How I can remove the background image with java script on runtime? I tried

document.getElementById("html").style.background="";
document.getElementsByTagName("html").style.background="";
document.getElementsByTagName("html")[0].style.background="";

But nothing is working. Anybody here who can give me a hint?

Class is set on the body, but you are selecting the html element? — epascarello
– epascarello, Commented Jan 28, 2019 at 18:20

Danyal Imran · Accepted Answer · 2019-01-28 18:14:35Z

16

Why html when you are using body as your CSS selector?

just use:

document.getElementsByTagName('body')[0].style.background = "none";

or

document.body.style.background = "none";

Code in action!

// removing background-color from body
document.getElementsByTagName('body')[0].style.background = "none";

body {
  height: 100px;
  width: 100%;
  background-color: red;
}

div {
  height: 40px;
  width: 20%;
  background-color: green;
}

<body>
 <div></div>
</body>

answered Jan 28, 2019 at 18:14

Danyal Imran

2,60515 silver badges21 bronze badges

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

2 Comments

Ingo Over a year ago

Many thanks, this document.body.style.background = "none"; works. I know the body was confusing but I tried both so sorry for this confusion.

Danyal Imran Over a year ago

@Ingo Its fine bro, we all make beginner mistakes when we started as well.

Facundo Colombier · Accepted Answer · 2024-03-01 18:40:40Z

0

just to remove the background image should do like:

document.body.style.backgroundImage = "none";

to avoid i.e. removing background-color or other css props that might be applied to just background

answered Mar 1, 2024 at 18:40

Facundo Colombier

3,6912 gold badges40 silver badges44 bronze badges

Collectives™ on Stack Overflow

Javascript change html or body css

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related