时间戳

首页 > 解决方案 > 如何修复 importnode 的 IE 兼容性问题

javascript - 如何修复 importnode 的 IE 兼容性问题

问题描述

我在 IE 使用 importnode 时遇到问题。如果没有 polyfill，我找不到解决此问题的最佳方法。有什么办法吗？

                   clones = el.childNodes;
                   for (var j = 0; j < clones.length; j++) {
                       if (clones[j].nodeType != 1) continue;
                       slides.appendChild(clones[j].cloneNode(true));
                   }
                   for (var j = 0; j < utilities.visibleSlides(el); j++) {                        
                           var clone = slides.childNodes[j],
                           cloneParent = document.createElement('div');
                           cloneParent.classList.add('tnt-slider-item');
                           cloneParent.classList.add('clone');
                           cloneParent.setAttribute('data-item', (slides.childNodes.length + j + 1));
                           cloneParent.appendChild(document.importNode(clone, true));
                           innerStage.appendChild(cloneParent);
                   }

标签： javascriptinternet-explorer

解决方案

请检查您的 IE 浏览器版本， Document.importNode() 方法支持 IE 9+。Internet explorer 8 及更早版本不支持 importNode() 方法。

如果你想在 IE8 及更早版本中使用 importNode() 方法，你可以尝试使用以下 polyfill：

'use strict';

if (!window.DocumentFragment && window.HTMLDocument) {
    window.DocumentFragment = HTMLDocument;
}

if (!document.ELEMENT_NODE) {
    document.ELEMENT_NODE = 1;
    document.ATTRIBUTE_NODE = 2;
    document.TEXT_NODE = 3;
    document.CDATA_SECTION_NODE = 4;
    document.ENTITY_REFERENCE_NODE = 5;
    document.ENTITY_NODE = 6;
    document.PROCESSING_INSTRUCTION_NODE = 7;
    document.COMMENT_NODE = 8;
    document.DOCUMENT_NODE = 9;
    document.DOCUMENT_TYPE_NODE = 10;
    document.DOCUMENT_FRAGMENT_NODE = 11;
    document.NOTATION_NODE = 12;
}

if (!document.createElementNS) {
    document.createElementNS = function (namespaceURI, qualifiedName) {
        return document.createElement(qualifiedName);
    };
}

if (!document.importNode) {
    document.importNode = function (node, deep) {
        var a, i, il;

        switch (node.nodeType) {
            case document.ELEMENT_NODE:
                var newNode = document.createElementNS(node.namespaceURI, node.nodeName);
                if (node.attributes && node.attributes.length > 0) {
                    for (i = 0, il = node.attributes.length; i < il; i++) {
                        a = node.attributes[i];
                        try {
                            newNode.setAttributeNS(a.namespaceURI, a.nodeName, node.getAttribute(a.nodeName));
                        }
                        catch (err) {
                            // ignore this error... doesn't seem to make a difference
                        }
                    }
                }
                if (deep && node.childNodes && node.childNodes.length > 0) {
                    for (i = 0, il = node.childNodes.length; i < il; i++) {
                        newNode.appendChild(document.importNode(node.childNodes[i], deep));
                    }
                }
                return newNode;

            case document.TEXT_NODE:
            case document.CDATA_SECTION_NODE:
                return document.createTextNode(node.nodeValue);

            case document.COMMENT_NODE:
                return document.createComment(node.nodeValue);

            case document.DOCUMENT_FRAGMENT_NODE:
                docFragment = document.createDocumentFragment();

                for (i = 0, il = node.childNodes.length; i < il; ++i) {
                    docFragment.appendChild(document.importNode(node.childNodes[i], deep));
                }
                return docFragment;
        }
    };
}

推荐阅读