You are here: Reference > JavaScript > client-side > style handling > methods > getExpression (runtimeStyle, style)

getExpression method (runtimeStyle, style)

Browser support:
9
Returns the dynamic expression for the specified style property.
The support for dynamic properties has been removed in Internet Explorer 9, so none of the getExpression, removeExpression, setExpression and recalc methods are supported. These methods exist in version 8, but using them raises exceptions.
Dynamic expressions (also called dynamic properties) provide a way to specify script expressions for the values of style properties. These expressions are recalculated automatically, but if necessary, they can be explicitly updated with the recalc method.
Expressions can be set with the setExpression method in JavaScript or with the style expression method in CSS. To remove an expression, use the removeExpression method. See the example below for details.
Dynamic expressions are also supported for the values of DHTML properties. If you need further information about it, see the pages for the htmlObj.getExpression, htmlObj.removeExpression and htmlObj.setExpression methods.

Syntax:

object.getExpression (propertyName);
You can find the related objects in the Supported by objects section below.

Parameters:

propertyName
Required. String that specifies the name of the style property. Use the name of the corresponding JavaScript property (camelCase name) instead of the name of the CSS property. The corresponding JavaScript property names can be found on the pages for the CSS properties. This parameter is not case-sensitive.

Return value:

String that retrieves the expression for the given style property.
If the given style property is not specified or its value is not an expression, the getExpression method returns undefined.

Example HTML code 1:

This example illustrates the use of dynamic expressions for style properties:
<head>
    <script type="text/javascript">
                // Try..catch blocks need to be used because of Internet Explorer 8
        function GetExp () {
            var div = document.getElementById ("myDiv");
            try {
                var expression = div.style.getExpression ("width");
                alert ("Expression is: " + expression);
            }
            catch (e) {
                alert ("Your browser does not support the getExpression method!");
            }
        }
        function SetExp () {
            var div = document.getElementById ("myDiv");
            try {
                div.style.setExpression ("width","myInput.value + 'px'");
            }
            catch (e) {
                alert ("Your browser does not support the setExpression method!");
            }
        }
        function RemoveExp () {
            var div = document.getElementById ("myDiv");
            try {
                div.style.removeExpression ("width");
            }
            catch (e) {
                alert ("Your browser does not support the removeExpression method!");
            }
        }
    </script>
</head>
<body>
    <div id="myDiv" style="background-color:blue; width:expression(myInput.value + 'px');"></div>
    <br />
    The following value specifies the width of the blue element.<br />
    Modify it and watch the blue element.
    <input type="text" id="myInput" value="40" />
    <br /><br /><br />
    With the following buttons you can get, remove and set the expression for the width style property of the blue element:<br />
    <button onclick="GetExp ()">Get expression!</button>
    <button onclick="SetExp ()">Set expression!</button>
    <button onclick="RemoveExp ()">Remove expression!</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content