Get inline style attributes from form.elements collection? 2

theniteowl · Dec 9, 2005

Hi All,
I am trying to read the inline style for form elements.
I am retrieving the form elements like this:
var elArr = objForm.elements;

I first want to test if the current element has an inline style but it always seems to test true as if it IS true even if no parameters are set.

I then want to get all the parameters of the style property or even better a string including all that are set.

I can do this:
var mystyle = elArr.style;
var myfont = mystyle.fontFamily;

But I would have to specifically name every attribute I am looking for and that get's cumbersome.
I seem to be able to get at the style as if it were a collection but I cannot access it like an array that I can iterate through or even check the length of.

Is there any way to do this? Preferably just pulling it like a string?

Paranoid? ME?? WHO WANTS TO KNOW????

BillyRayPreachersSon · Dec 9, 2005

Try either:

Code:

elArr[elNo].style.cssText

or

Code:

elArr[elNo].getAttribute('style')

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

cLFlaVA · Dec 9, 2005

BRPS beat me to it, i was putting together an example. try this:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]

<html>
<head>
<title>Untitled</title>

<script type="text/javascript"><!--
function showStyles() {
    var s = document.getElementById('myDiv').style.cssText;
    var c = s.split(";");
    for ( var i = 0; i < c.length; i++ ) {
        var p = c[i].split(":");
        alert( p[0] + " is " + p[1] );
    }
}
//--></script>
</head>

<body onload="showStyles();">

<div id="myDiv" style="height: 200px; width: 150px; color: red; font-weight: bold;"></div>

</body>
</html>

*cLFlaVA
----------------------------
[tt]I already made like infinity of those at scout camp...[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
[banghead]

theniteowl · Dec 9, 2005

Beautiful!
elArr[elNo].style.cssText works like a charm.

I could not get elArr[elNo].getAttribute('style') to work though. It returns an object but I cannot seem to access it's properties. Or would I go after attributes of the object?

I have been searching for info on this for a while but could not find anything clear on doing it. What I have read lead me to believe that the DOM did not have access to the style properties but I had seen snippets of code that did it, just not ones able to do inline properties.

Any browser issues with the above methods?

Thanks guys.

Paranoid? ME?? WHO WANTS TO KNOW????

BillyRayPreachersSon · Dec 9, 2005

As far as I know cssText is fairly well supported by most of the major browsers, and is part of the DOM Level 2 CSS Interface. See the W3C website for more information:

http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSRule-cssText

Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Get inline style attributes from form.elements collection? 2

theniteowl

Programmer

BillyRayPreachersSon

Programmer

cLFlaVA

Programmer

theniteowl

Programmer

BillyRayPreachersSon

Programmer

Similar threads

Part and Inventory Search

Sponsor