jo*********@yahoo.com wrote:
Hi all...
I included a css file on my html and i need to check some properties.
The html is: <style id="myid" src="mycsspage.css"> </style>
Now i need something to access it like:
alert(document.getElementById("myid").bottomline.c olor);
If you are trying to access a particular style property of an
element, use:
alert(document.getElementById("myid").style.proper ty);
where "property" is the style property you are trying to access.
You must change hyphenated style properties to "camelCase", e.g.
background-color becomes backgroundColor.
If you want to get all the style properties to see what's set,
get the element attributes collection and print out just the
style. e.g.
function doStyle(elementID) {
var eAtt = document.getElementById(elementID).attributes;
for (var i=0, len=eAtt.length; i<len; i++) {
if(eAtt[i].name == 'style')
alert(eAtt[i].value);
}
}
or
alert(document.all["myid"].style.bottomline.color);
The code above doesn't work on IE and Netscape 7.1...
Because there is no style property for "bottomline". A list of
the DOM CSS properties that work with Mozilla/Firefox are here:
<URL:http://www.mozilla.org/docs/dom/domref/dom_style_ref18.html#1002335>
If, on the other hand, you are trying get the *class* bottomline
and it's attributes that you have defined in the style sheet,
that is a totally different thing. You must access the
styleSheets collection, then the cssRules collection, then to
isolate the particular rule, look for the selectorText
(essentially equivalent to the class name, including the leading
'.', '#', etc.). But beware, IE puts an asterisk (*) in front of
the selectorText.
Say the following class called "aClass" is the first rule in the
first style sheet:
.aClass {color: grey; background-color: red;}
You can get all the style properties as:
document.styleSheets[0].cssRule[0].style.cssText
or just the selector text (class name):
document.styleSheets[0].cssRules[0].selectorText;
But beware, that just gets the definition from the style sheet,
it doesn't tell you what is actually set on the element.
Have a look around here:
<URL:http://www.mozilla.org/docs/dom/domref/dom_style_ref14.html#998514>
--
Rob