You are here: Reference > JavaScript > client-side > style handling > properties > selector (CSSPageRule, page)

selector property (CSSPageRule, page)

Browser support:
Returns the selector component of a @page rule as a string.
The @page at-rule does not work in Internet Explorer before version 8.
If a @page at-rule contains a selector, the rule is parsed as an unknown rule in Internet Explorer from version 8.
Therefore, the selector property is not too useful.

Syntax:

object.selector;
You can find the related objects in the Supported by objects section below.
This property is read-only.

Possible values:

String that represents the selector.
Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the selector property:
<head>
    <style id="myStyle">
        @page myPage {
            margin-left: 13cm;
            margin-right: 4cm;
        }
    </style> 

    <script type="text/javascript">
        function GetPageRule () {
            var styleTag = document.getElementById ("myStyle");

                // the style sheet in the style tag
            var sheet = styleTag.sheet ? styleTag.sheet : styleTag.styleSheet;

            if (sheet.cssRules) { // all browsers, except IE before version 9
                    // The page rules are not in the cssRules collection
                    // in Firefox and Safari before version 5.
                    // The length of the cssRules collection is zero in Internet Explorer from version 8
                    // because the page at-rule has a selector
                if (sheet.cssRules.length > 0) {
                    var pageRule = sheet.cssRules[0];
                    alert (pageRule.cssText);
                    return;
                }
            }
            else {  // Internet Explorer before version 9
                    // the length of the pages collection is zero in Internet Explorer from version 8
                    // because the page at-rule has a selector
                if (sheet.pages && sheet.pages.length > 0) {
                    var pageRule = sheet.pages[0];
                    alert (pageRule.selector);
                    return;
                }
            }

                // Firefox, Safari before version 5, Internet Explorer from version 8
            alert ("Your browser does not support this example!");
        }
    </script> 
</head>
<body>
    <button onclick="GetPageRule ()">Get the page rule!</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content