如何优化js代码

Question

How can I optimize my JS code from:

$(window).scroll(function() {
    if ($('#sec1').isVisible()) {
        $('.js-nav a.m1').addClass('active');
    } else {
        $('.js-nav a.m1').removeClass('active');
    }

    // ...

    if ($('#sec5').isVisible()) {
        $('.js-nav a.m5').addClass('active');
    } else {
        $('.js-nav a.m5').removeClass('active');
    }
});

http://jsfiddle.net/Kwiatkowski/qx8jodzx/

DIV has an attribute referring to a menu item

<div id="sec1" class="box-fh test1" data-menu="m1">
    <h1>box1</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam diam orci, lobortis ut accumsan non, semper ut purus. Quisque ut blandit elit. Integer pulvinar dolor sit amet dictum auctor. Morbi sed felis et velit fringilla convallis. Nullam feugiat lectus id ultrices gravida. Fusce fringilla et dolor in egestas. Cras pretium euismod mauris, id luctus turpis dapibus at. Cras fringilla elit erat, vel dictum odio bibendum et.</p>
    <div class="js-nav section-nav">
        <a class="next" href="#sec2">box2</a>
    </div> <!-- .section-nav -->
</div>

Answer 1

You can use each loop by class to check all visible elements.
Get id and split it to get number and switch equivalent element active class.
I put it to switchClass function and execute after animation of scrolling is done.

$('a[href*=#]:not([href=#])').click(function() {
  if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') &&
      location.hostname == this.hostname) {
    var target = $(this.hash);
    target = target.length ? target : $('[name=' + this.hash.slice(1) +']');

    if (target.length) {
      $('html,body').animate({
        scrollTop: target.offset().top - 0
      }, 1000, switchClass);

      return false;
    }
  }
});

$.fn.isVisible = function() {
    var windowScrollTopView = $(window).scrollTop();
    var windowBottomView = windowScrollTopView + $(window).height();
    var elemTop = $(this).offset().top;
    var elemBottom = elemTop + $(this).height();

    return ((elemBottom <= windowBottomView) && (elemTop >= windowScrollTopView));
}


function switchClass() {
    $('.box-fh').each(function() {
    var nr = this.id.split('sec')[1];

        if($(this).isVisible()) {
            $('.js-nav a.m' + nr).addClass('active');
        } else {
            $('.js-nav a.m' + nr).removeClass('active');
        }
    });
}