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.


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


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:
    <style id="myStyle">
        @import url('style.css');
    <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);
    <button onclick="RemoveCssImport ();">Remove import from styleSheet</button>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content