Page 1 of 1

Changing bgcolor fails

Posted: Sat Sep 08, 2007 8:06 am
by arukomp
Hi,

I want to change html element's attributes with javascript. It's possible, right? I saw tutorials on w3schools.com about that and it works.

I find a problem myself and I can't find what's wrong with my code.

I generate a table within php. I give each <td> element an ID with a numeric value (1 to 31) and a onclick event which should start javascript function to change that <td> element's bgcolor value:

Code: Select all

function changeColor(id)
{
	var x=document.getElementById(id)
	x.bgcolor="#000000"
	alert("Done. Color: " + x.bgcolor)
}
Now at first, all bgcolor values are set to #FFFFFF. When I click on a table cell, that javascript function is called and alert box comes out with this - "Done. Color: #000000". Everything seems ok, but the color of that table cell didn't change, it's still the same white color. What's the problem? Is it the wrong way to change element's attributes? If so, how to do it?

Thanks very much.

Posted: Sat Sep 08, 2007 8:42 am
by nickvd
try x.style.background = '#colour'

Posted: Sat Sep 08, 2007 9:35 am
by arukomp
nickvd wrote:try x.style.background = '#colour'
Thanks, it works! :D

Posted: Sat Sep 08, 2007 10:41 am
by nickvd
Glad I could help!

Posted: Sat Sep 08, 2007 5:09 pm
by superdezign
The "correct" solution is that there is no bgcolor attribute in JavaScript. It's backgroundColor.

Posted: Sun Sep 09, 2007 12:07 am
by arukomp
superdezign wrote:The "correct" solution is that there is no bgcolor attribute in JavaScript. It's backgroundColor.
but there is bgcolor attribute in <td> tag, so I tried to change that within JS, like changing href attribute in <a> tag, which was showed in W3Schools and worked. I thought I could change every html element's attribute, but it seems not

Posted: Sun Sep 09, 2007 12:11 am
by feyd
"href" is a registered property of an anchor object in Javascript. "bgcolor" is not.

Posted: Sun Sep 09, 2007 12:18 am
by arukomp
feyd wrote:"href" is a registered property of an anchor object in Javascript. "bgcolor" is not.
hm... That makes sense. Is 'style' attribute registered in Javascript? How do I know if attribute is registered or not? I'll be working with javascript quite a lot, so I need to know. Thanks

Posted: Sun Sep 09, 2007 6:44 am
by superdezign
arukomp wrote:
feyd wrote:"href" is a registered property of an anchor object in Javascript. "bgcolor" is not.
hm... That makes sense. Is 'style' attribute registered in Javascript? How do I know if attribute is registered or not? I'll be working with javascript quite a lot, so I need to know. Thanks
"Style" isn't a simple attribute. The style member of a DOM Element object is actually an Object that you add attributes to (i.e. backgroundColor).

Good references for the DOM and such are the MDC, Quirksmode, somewhere in the MSDN (if you are curious about the differences in IE's DOM and the standard DOM), and it's always good to have Firebug handy if you have Firefox.

Also, just an FYI, there are also setAttribute() methods. As the DOM matures, they are trying to standardize more and more of the functionality and move programmers away from simple value assignments and add more flexibility.

Posted: Tue Sep 11, 2007 7:48 am
by arukomp
Thanks, superdezign, very useful post :D