In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > style handling > properties > readOnly (CSSStyleRule, rule, styleSheet)

readOnly property (CSSStyleRule, rule, styleSheet)

Browser support:

Returns a Boolean value that indicates whether the current style sheet or rule is imported or not.

While designMode is enabled, the contents of the imported style sheets cannot be modified by scripts. Style sheets can be imported with the link element or the @import style rule.

Syntax:

object.readOnly;

You can find the related objects in the Supported by objects section below.

This property is read-only.

Possible values:

One of the following values:

false

The style sheet or rule is internal.

true

The style sheet or rule is imported.

Default: false.

Example HTML code 1:

This example illustrates the use of the readOnly property:

Code

style.css

<head>
    <link rel="stylesheet" type="text/css" href="style.css" />
    <style>
        .forTest {color:green;}
    </style>

    <script type="text/javascript">
        function TestReadOnly () {
            var styleSheet = document.styleSheets[0];
            if (styleSheet.readOnly) {
                alert ("The first style sheet is imported.");
            }
            else {
                alert ("The first style sheet is internal.");
            }

            styleSheet = document.styleSheets[1];
            if (styleSheet.readOnly) {
                alert ("The second style sheet is imported.");
            }
            else {
                alert ("The second style sheet is internal.");
            }
        }
    </script> 
</head>
<body>
    <button onclick="TestReadOnly ()">Test parentStyleSheet!</button>
</body>