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

You are here: Reference > JavaScript > client-side > style handling > methods > removeImport (styleSheet)

removeImport method (styleSheet)

Browser support:

Removes an imported style file from the imports collection of the current styleSheet object.

The imports collection represents the @import rules contained by a styleSheet object. So the removeImport method removes an @import rule from a styleSheet object.

The cssRules collection represents the CSS rules in a style sheet and supported in all browsers except in Internet Explorer before version 9. Use the deleteRule method in those browsers to remove an @import rule from a style sheet.

Syntax:

object.removeImport (positionIndex);

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

Parameters:

positionIndex

Optional. Zero-based integer that specifies the position of the imported style file to remove in the imports collection.

Return value:

Returns the index of the newly added stylesheet in the imports collection. This value is a zero-based integer.

Example HTML code 1:

This example illustrates the use of the removeImport method:

Code

style.css

<head>
    <style id="myStyle">
        @import url('style.css');
    </style>
    <script type="text/javascript">
        function RemoveCssImport () {
            var styleTag = document.getElementById ("myStyle");

            if (styleTag) {
                var sheet = styleTag.sheet ? styleTag.sheet : styleTag.styleSheet;

                if (sheet.deleteRule) {
                    sheet.deleteRule (0);

                    // The complete style element must be deleted to 
                    // update the style settings in Firefox and Opera
                    styleTag.parentNode.removeChild (styleTag);
                }
                else {
                    if (sheet.removeImport) 
                    {
                        sheet.removeImport (0);
                    } 
                }
            }
        }
    </script>
</head>
<body>
    <button onclick="RemoveCssImport ();">Remove import from styleSheet</button>
</body>