将多个 Javascript 文件合并为一个

问题描述

可能是很明显的事情，但 Javascript 不是我的强项，所以我需要一些建议。

我正在为我的网站使用引导程序模板，它自带 8 个 Javascript 文件，而且我还创建了另一个。加载 9 个 Javascript 文件使我的网站加载速度变慢，因此我想将一些文件合二为一以提高速度。

我假设我可以将文件 A 复制并粘贴到文件 B 中，并且我会保留相同的功能……但是，当我对以下文件执行此操作时，我的站点中完全失去了文件 A 的功能。

文件 A：

document.body.addEventListener('change',e => {
  if (e.target && e.target.classList.contains('goto')) {
    window.location.href = e.target.dataset.target;
  }
});

文件 B：

AOS.init({
    duration: 800,easing: 'slide',once: true
});

// tried inserting it here

jQuery(document).ready(function($) {

    "use strict";

    var slider = function() {
        $('.nonloop-block-3').owlCarousel({
            center: false,items: 1,loop: false,stagePadding: 15,margin: 20,nav: true,navText: ['<span class="icon-arrow_back">','<span class="icon-arrow_forward">'],responsive: {
                600: {
                    margin: 20,items: 2
                },1000: {
                    margin: 20,items: 3
                },1200: {
                    margin: 20,items: 3
                }
            }
        });
    };
    slider();


    var siteMenuClone = function() {

        $('<div class="site-mobile-menu"></div>').prependTo('.site-wrap');

        $('<div class="site-mobile-menu-header"></div>').prependTo('.site-mobile-menu');
        $('<div class="site-mobile-menu-close "></div>').prependTo('.site-mobile-menu-header');
        $('<div class="site-mobile-menu-logo"></div>').prependTo('.site-mobile-menu-header');

        $('<div class="site-mobile-menu-body"></div>').appendTo('.site-mobile-menu');



        $('.js-logo-clone').clone().appendTo('.site-mobile-menu-logo');

        $('<span class="ion-ios-close js-menu-toggle"></div>').prependTo('.site-mobile-menu-close');


        $('.js-clone-nav').each(function() {
            var $this = $(this);
            $this.clone().attr('class','site-nav-wrap').appendTo('.site-mobile-menu-body');
        });


        setTimeout(function() {

            var counter = 0;
            $('.site-mobile-menu .has-children').each(function() {
                var $this = $(this);

                $this.prepend('<span class="arrow-collapse collapsed">');

                $this.find('.arrow-collapse').attr({
                    'data-toggle': 'collapse','data-target': '#collapseItem' + counter,});

                $this.find('> ul').attr({
                    'class': 'collapse','id': 'collapseItem' + counter,});

                counter++;

            });

        },1000);

        $('body').on('click','.arrow-collapse',function(e) {
            var $this = $(this);
            if ($this.closest('li').find('.collapse').hasClass('show')) {
                $this.removeClass('active');
            } else {
                $this.addClass('active');
            }
            e.preventDefault();

        });

        $(window).resize(function() {
            var $this = $(this),w = $this.width();

            if (w > 768) {
                if ($('body').hasClass('offcanvas-menu')) {
                    $('body').removeClass('offcanvas-menu');
                }
            }
        })

        $('body').on('click','.js-menu-toggle',function(e) {
            var $this = $(this);
            e.preventDefault();

            if ($('body').hasClass('offcanvas-menu')) {
                $('body').removeClass('offcanvas-menu');
                $this.removeClass('active');
            } else {
                $('body').addClass('offcanvas-menu');
                $this.addClass('active');
            }
        })

        // click outisde offcanvas
        $(document).mouseup(function(e) {
            var container = $(".site-mobile-menu");
            if (!container.is(e.target) && container.has(e.target).length === 0) {
                if ($('body').hasClass('offcanvas-menu')) {
                    $('body').removeClass('offcanvas-menu');
                }
            }
        });
    };
    siteMenuClone();


    var sitePlusMinus = function() {
        $('.js-btn-minus').on('click',function(e) {
            e.preventDefault();
            if ($(this).closest('.input-group').find('.form-control').val() != 0) {
                $(this).closest('.input-group').find('.form-control').val(parseInt($(this).closest('.input-group').find('.form-control').val()) - 1);
            } else {
                $(this).closest('.input-group').find('.form-control').val(parseInt(0));
            }
        });
        $('.js-btn-plus').on('click',function(e) {
            e.preventDefault();
            $(this).closest('.input-group').find('.form-control').val(parseInt($(this).closest('.input-group').find('.form-control').val()) + 1);
        });
    };
    sitePlusMinus();


    var siteSliderRange = function() {
        $("#slider-range").slider({
            range: true,min: 0,max: 500,values: [75,300],slide: function(event,ui) {
                $("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]);
            }
        });
        $("#amount").val("$" + $("#slider-range").slider("values",0) +
            " - $" + $("#slider-range").slider("values",1));
    };
    siteSliderRange();


    var siteMagnificPopup = function() {
        $('.image-popup').magnificPopup({
            type: 'image',cloSEOnContentClick: true,closeBtnInside: false,fixedContentPos: true,mainClass: 'mfp-no-margins mfp-with-zoom',// class to remove default margin from left and right side
            gallery: {
                enabled: true,navigateByImgClick: true,preload: [0,1] // Will preload 0 - before current,and 1 after the current image
            },image: {
                verticalFit: true
            },zoom: {
                enabled: true,duration: 300 // don't foget to change the duration also in CSS
            }
        });

        $('.popup-youtube,.popup-vimeo,.popup-gmaps').magnificPopup({
            disableOn: 700,type: 'iframe',mainClass: 'mfp-fade',removalDelay: 160,preloader: false,fixedContentPos: false
        });
    };
    siteMagnificPopup();

});

// tried inserting it here too...

我假设这是某种新手错误，因为我不太熟悉 Javascript，而不是错误，因此将不胜感激任何帮助或指导！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）