Jquery 交叉点观察者API不可用

我开发了一个无限滚动的网站。我的网页在google chrome中加载了该技术的内容。但在Internet explore中加载和滚动网页时，会显示一个错误“Intersect Observer API不可用”。如何解决这个问题

这是我的密码

(function ($) {
    $.fn.infiniteScroll = function (options) {

        var observer, filesControl = 0, settings;
        settings = $.extend({
            files: [],
            preloaderColor: "#000",
            fadeDuration: 300,
            beforeLoadNewContent: function () { },
            processData: function(data){               
                var content ='<div>'+(data)+'</div>';
                $('.' + settings.markSelector).before(content);
                $(content).fadeTo(settings.fadeDuration, 1);
            },
            afterLoadNewContent: function () { },
            onEnd: function () { }
        }, options);
        settings.markSelector;

        infiniteContentLoader = function (entry) {
            if (entry[0].isIntersecting && !$(".infiniteContentPreloader").is(":visible") && filesControl < settings.files.length) {
                $(".infiniteContentPreloader").toggle();
                $.ajax({
                    type: "GET", 
                    url:settings.files[filesControl], 
                    dataType: "html", 
                    success:function (data) {                  
                        settings.beforeLoadNewContent();
                        $(".infiniteContentPreloader").toggle();                   
                        settings.processData(data);
                        filesControl++;
                        settings.afterLoadNewContent();
                    }
                });
            } else if(entry[0].isIntersecting && !$(".infiniteContentPreloader").is(":visible") && filesControl >= settings.files.length) {
                observer.disconnect();
                settings.onEnd();
            }
        }

        infiniteScroll = function (element) {
            settings.markSelector = "infiniteContentMark_" + Date.now();
            var mark = '<div class="' + (settings.markSelector) + '" style="width:100%;"></div>';
            $(element).append(mark);

           $(document).ready(function () {
                $('.' + settings.markSelector).html('<div class="infiniteContentPreloader" style="width: 150px; height: 150px; margin: 0 auto; display: none;"><svg version="1.1" id="L4" xmlns="http://www.w3.org/2000/svg" xmlns: xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 0 0" xml: space="preserve"><circle fill="'+ (settings.preloaderColor) + '" strok="none" cx="6" cy="50" r="6"><animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin="0.1"></animate></circle><circle fill="'+ (settings.preloaderColor) + '" stroke="none" cx="26" cy="50" r="6"><animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin="0.2"></animate></circle><circle fill="'+ (settings.preloaderColor) + '" stroke="none" cx="46" cy="50" r="6"><animate attributeName="opacity" dur="1s" values="0;1;0" repeatCount="indefinite" begin="0.3"></animate></circle></svg></div>');

                if (!('IntersectionObserver' in window)) {
                    console.log("Intersection Observer API is not available");
                } else {
                    var options = {
                        root: null,
                        rootMargin: '0px',
                        threshold: 0
                    }
                    observer = new IntersectionObserver(infiniteContentLoader, options);
                    var infiniteContentMark = $('.' + settings.markSelector).toArray()[0];
                    observer.observe(infiniteContentMark);
                }
            });
        }

        if (this.length > 0) {
            return infiniteScroll(this);
        }
    };
})(window.jQuery || window.Zepto || window.$);

（函数（$）{
$.fn.infiniteScroll=函数（选项）{
变量观察者，filecontrol=0，设置；
设置=$.extend({
文件：[]，
预彩色：“000”，
教育：300，
beforeLoadNewContent:函数（）{}，
processData:函数（数据）{
var内容=''+（数据）+''；
$（'..+settings.markSelector）.before（content）；
$（content.fadeTo）（settings.fadeDuration，1）；
},
afterLoadNewContent:函数（）{}，
onEnd:function（）{}
}，选项）；
设置.标记选择器；
infiniteContentLoader=函数（条目）{
如果（条目[0].isIntersecting&&！$（“.InfiniteContentPreload”）.is（“：visible”）&&FileControl=settings.files.length）{
observer.disconnect（）；
settings.onEnd（）；
}
}
无限滚动=函数（元素）{
settings.markSelector=“infiniteContentMark_u3;”+Date.now（）；
var标记=“”；
$（元素）。追加（标记）；
$（文档）.ready（函数（）{
$（'..+settings.markSelector.html（''）；
如果（！（窗口中的“IntersectionObserver”）{
console.log（“十字路口观察者API不可用”）；
}否则{
变量选项={
root:null，
rootMargin:'0px'，
阈值：0
}
observer=新的IntersectionObserver（infiniteContentLoader，选项）；
var infiniteContentMark=$（'..+settings.markSelector）.toArray（）[0]；
观察者。观察（无穷远）；
}
});
}
如果（此长度>0）{
返回卷（本）；
}
};
})（window.jQuery | | window.Zepto | | window.$）；

但是当在Internet上加载和滚动网页时

寻找接缝很简单，但可能很难修复的原因：

表示浏览器不支持

IntersectionObserver

。换句话说：代码很可能只在列出的浏览器中工作

---

正如@Clone的答案中所提到的，如果包含polyfill，应该很容易修复。

Internet Explorer不支持Intersection Observer

幸运的是，W3C提供了一个您可以使用的polyfill

---

有了这个功能，您可以像往常一样继续使用交叉点观察者，而较旧的浏览器将使用绑定到滚动事件的事件（性能不如本机交叉点观察者）

我建议使用polyfill.io服务。如果在页面中包含以下代码：

<script src="https://polyfill.io/v2/polyfill.min.js?features=IntersectionObserver"></script>

它将根据浏览器自动运送所需的polyfill。因此，如果用户使用的是不需要polyfill的Chrome浏览器，它甚至不会将这些字节发送到浏览器

<script src="https://polyfill.io/v2/polyfill.min.js?features=IntersectionObserver"></script>