Question

Microsoft Edge正在抛弃“不支持此类界面”＃39;尝试将克隆的内容附加到新窗口时出错。这是一个例子：

jQuery(document).ready(function() {
    jQuery('.trigger').click(function() {
        var target = jQuery(this).data('print_target');

        var w = window.open('', '', 'status=no, toolbar=no, menubar=no, location=no');
        var print_html = '<!DOCTYPE html><head><title>' + document.getElementsByTagName('title')[0].innerHTML + '</title></head><body></body></html>';
        w.document.write( print_html );

        var ua = window.navigator.userAgent;
        var ie = true;

        //.html() required for IE browsers
        if ( ua.indexOf("MSIE ") != -1) {
            //console.log('MSIE - Craptastic');
            jQuery(w.document.body).append( jQuery( target ).clone( true ).html() );
        }
        else if ( ua.indexOf("Trident/") != -1) {
            //console.log('IE 11 - Trident');
            jQuery(w.document.body).append( jQuery( target ).clone( true ).html() );
        }
        else if ( ua.indexOf("Edge/") != -1 ){
            console.log('IE 12 - Edge');
            //error: No such interface supported
            jQuery(w.document.body).append( jQuery( target ).clone( true ).html() );

            //works
            //jQuery(w.document.body).append( 'hey dude, this is some text' );

            //works
            //jQuery(w.document.body).html( jQuery( target ).clone( true ).html() );

        }
        else{
            //console.log('proper browser');
            jQuery(w.document.body).append( jQuery( target ).clone( true ) );
            ie = false;
        }
    });
});

这只是Microsoft Edge的一个问题，它适用于所有基于标准的浏览器和IE浏览器7,8,9,10和11.类似的问题是raised in this thread但未解决。

这里有一个jsfiddle显示了什么：https://jsfiddle.net/switzerbaden/nhtywLsp/

Answer 1

经过进一步调查，我发现当你的HTML字符串产生多个顶级兄弟元素时，jQuery将创建一个documentFragment。当Microsoft Edge尝试将documentFragment附加到第二个窗口时，问题就出现了。

现在，我建议您将HTML传递给append方法，该方法只生成一个顶级元素，并从两侧修剪空白。这样，我们保证jQuery不会尝试附加documentFragment，而是单个元素。

已针对Microsoft Edge提交了一个错误，并且已通知jQuery团队。

我是Microsoft Edge团队的工程师，我看到了您所指的问题。我要提交一个错误，并进一步调查，但暂时解决一下，目标只有一个子元素，并在追加时修剪内容：

<div id="my_target">
    <div>
        <!-- move contents in here -->
    </div>
</div>

$(w.document.body).append(
    // Or, "<div>" + $(target).html() + "</div>"
    $.trim( $(target).clone(true).html() )
);

经过一些粗略的测试，这似乎解决了这个问题。

Answer 2

首先克隆HTML，然后在div之前添加div，然后在其之后关闭：

var new_target = jQuery.trim( jQuery( target ).clone( true ).html() );
jQuery( w.document.body ).append( "<div>" + new_target + "</div>" );

jQuery append（）进入不与Microsoft Edge

2 个答案: