How to get color of div with javascript

Question

I have been working on getting the background color of a div and add padding to the div i want to do this WITHOUT JQUERY I have the html but no javascript yet. I have been trying the other code from google but it will not work. What i am trying do not work so I am looking for someone who can get me the code for this project. THIS NEEDS TO BE

WITHOUT JQUERY

HTML CODE:

<div style="background: green">
     HELLO WORLD
</div>

Thank You.

Without using jquery acheving this can be possible using sass and less or if you want yo get the background color using jquery than you can do it like div.style.backgroundColor; — Anil Panwar, Dec 20 '15 at 17:16

score 2 · Accepted Answer · edited Dec 20 '15 at 17:23

ELEMENT.style.backgroundColor will give you the CSS-Attribute of the Element. (You can also use it to set the color)

To set the padding use ELEMENT.style.padding = "10px"

alert(document.getElementById("myDiv").style.backgroundColor)

document.getElementById("myDiv").style.padding = "100px"

<div id="myDiv" style="background: green">
     HELLO WORLD
</div>

score 1 · Answer 2 · answered Dec 20 '15 at 17:16

For this particular example:

<div style="background: green">
    HELLO WORLD
</div>

You can just pick it up from the style object:

document.querySelector('div').style.background;

If it's applied through a style tag or a stylesheet then you can use:

window.getComputedStyle(document.querySelector('div')).background

Ibrahim Khan · Answer 3 · 2015-12-20T17:19:32.537

0

Try this.

document.getElementsByTagName('div')[0].style.backgroundColor

edited Dec 20 '15 at 17:19

answered Dec 20 '15 at 17:10

Ibrahim Khan

20,616
7
42
55

How to get color of div with javascript

WITHOUT JQUERY

3 Answers3