You are here: Reference > JavaScript > client-side > style handling > properties > owningElement (styleSheet)

owningElement property (styleSheet)

Browser support:
Returns a reference to the element that contains the current styleSheet object.
  • If the current stylesheet belongs to a style element, then returns the style element.
  • If the current stylesheet was imported by a link element, then returns the link element.
  • If the current stylesheet was imported by an @import style rule, then returns null. In that case, use the ownerRule property to get the rule that imported the current stylesheet.
In Firefox, Opera, Google Chrome, Safari and Internet Explorer from version 9, use the ownerNode property instead of the owningElement property.

Syntax:

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

Possible values:

Returns a reference to the owner object or returns null.
Default: this property has no default value.

Example HTML code 1:

This example illustrates the use of the owningElement property:
Code
style.css
<head>
    <link rel="stylesheet" type="text/css" href="style.css" />

    <script type="text/javascript">
        function GetOwner () {
            var styleSheet = document.styleSheets[0];
            if (styleSheet.ownerNode) {
                var doc = styleSheet.ownerNode;
            } else if (styleSheet.owningElement) {
                var doc = styleSheet.owningElement;
            }
            alert ("The nodeName of the returned object:  " + doc.nodeName);
        }
    </script> 
</head>
<body>
    <button onclick="GetOwner ()">Get the owner element of a stylesheet!</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content