...

View Full Version : programatically changing many styles



wac
04-07-2003, 11:16 PM
In CSS one can have a single style apply to many elements.
If one wants to programatically change the font of many elements in javascript, must one iteratively grind through each element, or is there a way to modify a single style and have that inherited by the many elements, much the same way as one would do inside of a CSS file???

In particular, I want to be able to change the font of some text elements within a DIV.

I know that I can put a <FONT> tag inside the DIV
<DIV> <FONT blah....> regular content </FONT></DIV>
But that would change EVERY element and I only want to change a specific (90%) set of elements.

brothercake
04-07-2003, 11:26 PM
Indeed there is - http://codingforums.com/showthread.php?s=&threadid=14259


But I do have to say; I've used this, and although it's much more elegant code, it wasn't actually any faster than iterating with getElementsByTagName


btw - you're not really using <font> tags ... are you? ;)

wac
04-07-2003, 11:41 PM
I haven't coded anything yet. Font was just the first thing to come to mind. What would you suggest for changing the font of text elements?

brothercake
04-07-2003, 11:47 PM
Define CSS classes for them; then you can change the styles programatically.

wac
04-07-2003, 11:56 PM
Ok, let me see if I understand this correctly...
The response you indicated would require that the elements be directly affected (inherit) the style, which is not how I originally phrased the problem. I was thinking that the elements would be contained by something which is affected by the style.
I'll attribute this to my not fully understanding how CSS might work (Highly likely)

so...
something like
.mydivclass * TD
{
font : ...... ;
}

would affect the font of all the TD elements within this DIV, or
alternatively, I could put a class="myfontstuff" on all the elements
whose font I want affected.
.myfontstuff
{
font: .... ;
}

then I could use the javascript code you pointed to and modify the style attribute.

Does this sound about right?
Thanx for the very quick response...

wac
04-08-2003, 12:05 AM
oops,
I just realized that the addressability of the style class
...
if (rules.item(i).type == CSSRule.STYLE_RULE && rules.item(i).selectorText == '.myP')
...

can I use

selectorText == ".class * element"

to search for
.class * element
{
}

and do I have to get the spacing exactly right

brothercake
04-08-2003, 12:09 AM
Well that particular rule you pasted will match

.myP { }

Not sure where you're getting that * from

wac
04-08-2003, 12:31 AM
I was trying to be fancy and applying the style to the childrent of a container without having to put the class attribute on all the child elements.

I got this from
http://www.echoecho.com/documentationframe.htm?http&&&www.w3.org/TR/REC-CSS2

'...The following selector:

DIV * P

matches a P element that is a grandchild or later descendant of a DIV element. Note the whitespace on either side of the "*". ...'

brothercake
04-08-2003, 01:23 PM
Oh right; well I'm not sure if you can select rules with that kind of syntax; I can't see why not - but you'd have to try it and see.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum