优化Javascript代码

Optimize Javascript code

本文关键字：代码 Javascript 优化      更新时间：2023-09-26

我请用任何方法来优化&压缩js代码

$("document").ready(function($) {
        var num = $('#menu').offset().top;
        var num2 = $('#HTML2').offset().top;
        var nav = $('#menu');
        var nav2 = $('#HTML2');
        $(window).scroll(function() {
            if ($(this).scrollTop() > num) {
                nav.addClass("menu-scroll");
            } else {
                nav.removeClass("menu-scroll");
            }
            if ($(this).scrollTop() > num2) {
                nav2.addClass("html2fixs");
            } else {
                nav2.removeClass("html2fixs");
            }
        });
    $('#BackToTop').click(function(){
        $('html, body').animate({scrollTop : 0},300);
        return false;
    });
});

和请任何提示如何加速所有JavaScript代码在我的网站?

您可以使用一个名为toggleScript的JQuery函数，这将使您的代码更短。此外，为了使您的代码更具可读性，最好调用所有变量，而不仅仅是num1和num2。当您将元素保存到变量中时—您不必再调用${}，而是使用变量。

$("document").ready(function() {
    var menu = $('#menu'); //nav
    var html2 = $('#HTML2'); //nav2
    var menuOffsetTop = menu.offset().top; //num
    var html2OffsetTop = html2.offset().top; //num2
    $(window).scroll(function() {
        var w = $(this);
        menu.toggleClass('menu-scroll' , (w.scrollTop() > menuOffsetTop) );
        /* 
        The same as
        if (w.scrollTop() > menuOffsetTop) {
            menu.addClass('menu-scroll') ;  
        } else {
            menu.removeClass('menu-scroll');
        }
        */
        html2.toggleClass('html2fixs' , (w.scrollTop() > html2OffsetTop) );
    });
    $('#BackToTop').click(function(){
        $('html, body').animate({scrollTop : 0},300);
    });
});

相关文章：