467,145 Members | 1,004 Online
Bytes | Developer Community
Ask Question

Home New Posts Topics Members FAQ

Post your question to a community of 467,145 developers. It's quick & easy.

Manipulating CSS class

Hi!

I want to directly manipulate a CSS class:

#bla
{
property: 123;
}

<span id="bla">foo</span>
<span id="bla">bar</span>

Both spans shall change when doing something like:

bla.property=321
Is this possible?

Timo
Jul 23 '05 #1
  • viewed: 1019
Share:
1 Reply
On Fri, 09 Apr 2004 19:54:03 +0200, Timo Nentwig <tc*@spamgourmet.org>
wrote:
I want to directly manipulate a CSS class:

#bla
{
property: 123;
}
That's actually a CSS declaration block which uses an ID selector. There's
nothing relating to classes there.
<span id="bla">foo</span>
<span id="bla">bar</span>
That's invalid HTML. The id attribute is supposed to uniquely identify an
element thoughout the entire document. You cannot do that if two values
are the same. What you're trying to do would be better acheived with:

<span class="bla">foo</span>
<span class="bla">bar</span>
Both spans shall change when doing something like:

bla.property=321

Is this possible?


In some browsers, yes. It requires support for the document.styleSheets
property. From there, you can find the style sheet that contains the
declaration and modify it.

function modifyRule( selector, property, value )
{
if( document.styleSheets )
{
var sS = document.styleSheets, s = null;

for( var i = 0, n = sS.length; i < n; ++i )
{
if(( s = sS[ i ]) && !s.disabled && s.cssRules )
{
var cR = s.cssRules, d;

for( var j = 0, m = cR.length; j < m; ++j )
{
if(( 1 == cR[ j ].type ) &&
( selector == cR[ j ].selectorText ) &&
( d = cR[ j ].style ))
{
if( d.getPropertyValue && d.setProperty &&
( null != d.getPropertyValue( property ))
{
d.setProperty( property, value, '' );
return true;
}
}
}
}
}
}
return false;
}

The function above is untested, but it should work in theory. If the
property value was set, the function will return true. If the function
fails, for any reason, it will return false.

Mike

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)
Jul 23 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

4 posts views Thread by Michael J. Astrauskas | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.