javascript - 没有过滤的页面上的混合过滤错误

在我的主页上，我使用了以下方法来进行混合:

var containerEl = document.querySelector('.gallery-container');
    var mixer = mixitup(containerEl, {
        selectors: {
            control: '[data-mixitup-control]'
        },
        load: {
            filter: '.engagement-ceremony'
        }
    });

我是从他们的网站上获得的。它工作正常，但是当我转到另一个页面时，在控制台中出现此错误:Uncaught Error: [MixItUp] An invalid selector or element reference was passed to the mixitup factory function，这导致页面上的其他js中断。

我以为可以试试看，看看会发生什么:

var mixer = mixitup('.gallery-container', {
        selectors: {
            control: '[data-mixitup-control]'
        },
        load: {
            filter: '.engagement-ceremony'
        }
    });

但是后来我得到了这个错误:Uncaught Error: [MixItUp] The provided selector yielded no container element。

我很困惑为什么这会以这种方式出错。

编辑
因此，我可以使它正常运行且没有错误的唯一方法是，使用mixitup脚本的这一部分，并使用php有条件地将其加载到我的主页上。一个骇人的修复程序使我感到困扰，但这是唯一可行的方法。

最佳答案

// Gallery Filtering
    var containerEl = document.querySelector('.gallery-container');
    var mixer;

    if (containerEl) {
        mixer = mixitup(containerEl, {
             selectors: {
                 control: '[data-mixitup-control]'
             },
             load: {
                 filter: '.engagement-ceremony'
             }
        });
    }

我不得不将脚本包装在if语句中。