By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
434,572 Members | 963 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 434,572 IT Pros & Developers. It's quick & easy.

stylesheets minipulation - Question: How to change a string to a property name.

Jezternz
100+
P: 145
OK.
I have made a function here that will suposedly go down the stylesheet and change particular properties. However I want to be able to make the property name defined when the function is called.

Function:
Expand|Select|Wrap|Line Numbers
  1. function changeRule(theNumber, property, value) {
  2.     var theRules = new Array();
  3.     if (document.styleSheets[0].cssRules) {
  4.         theRules = document.styleSheets[0].cssRules;
  5.     } else if (document.styleSheets[0].rules) {
  6.         theRules = document.styleSheets[0].rules;
  7.     }
  8.  
  9.     theRules[theNumber].style.[property] = value;
  10. }
  11.  
Basic Function call:
Expand|Select|Wrap|Line Numbers
  1. changeRule(1, 'backgroundImage', 'url(./images/corner2.gif)');
  2.  
so basicly I want the "property" variable to apear as the propertyname. How can i do this? any other suggestions to improve this code?
Jan 11 '08 #1
Share this Question
Share on Google+
2 Replies


100+
P: 210
Expand|Select|Wrap|Line Numbers
  1. var theRules = new Array();
  2.  
It's already an array so don't need that.
Expand|Select|Wrap|Line Numbers
  1.     if (document.styleSheets[0].cssRules) 
  2.  
Don't blindly assume that document.styleSheets is supported
Expand|Select|Wrap|Line Numbers
  1.     theRules[theNumber].style.[property] = value;
  2.  
theRules[theNumber].style[property] = value;


Expand|Select|Wrap|Line Numbers
  1. function changeRule(theNumber, property, value)
  2. {
  3.   var theRules, ss=document.styleSheets||null;
  4.  
  5.   if(ss && ss.length)
  6.   {
  7.    ss=ss[0]; 
  8.    if( theNumber < (theRules=ss.rules||ss.cssRules).length)
  9.     theRules[theNumber].style[property] = value; 
  10.   }
  11. }
Jan 12 '08 #2

Jezternz
100+
P: 145
ok thanks heaps man. Much apreciated. Can I ask if there is an alternative to stylsheets? This method seems very bitsy, I would like a cleaner script or is this not possible with todays browsers.

By the way the whole reason I am using style sheets is because I want to change the properties of elements like follows .class #id ellement{} eg .big #bigger h1{}
and u cant do this using the standard getelementbyid.
So if theres anotehr way, please tell me :).

Thanks again, Josh
Jan 12 '08 #3

Post your reply

Sign in to post your reply or Sign up for a free account.