Question

我有以下用于响应式导航的jQuery代码，需要将其转换为常规的Javascript。我试图了解removeAttr和儿童一样的工作方式。

那里有人知道如何将以下代码转换为纯JavaScript吗？

let responsiveMenu = function() {
  var menuType = 'desktop';
  
  $(window).on('load resize', function() {
    var currMenuType = 'desktop';
    if (matchMedia('only screen and (max-width: 991px)').matches) {
      currMenuType = 'mobile';
    }

    if (currMenuType !== menuType) {
      menuType = currMenuType;
      if (currMenuType === 'mobile') {
        var $mobileMenu = $('#mainnav').attr('id', 'mainnav-mobi').hide();
        var hasChildMenu = $('#mainnav-mobi').find('li:has(ul)');
        $('#header #site-header-inner').after($mobileMenu);
        hasChildMenu.children('ul').hide();
        hasChildMenu.children('a').after('<span class="btn-submenu"></span>');
        $('.btn-menu').removeClass('active');
      } else {
        var $desktopMenu = $('#mainnav-mobi').attr('id', 'mainnav').removeAttr('style');
        $desktopMenu.find('.submenu').removeAttr('style');
        $('#header').find('.nav-wrap').append($desktopMenu);
        $('.btn-submenu').remove();
      }
    }
  });

  $('.mobile-button').on('click', function() {
    $('#mainnav-mobi').slideToggle(300);
    $(this).toggleClass('active');
  });

  $(document).on('click', '#mainnav-mobi li .btn-submenu', function(e) {
    $(this).toggleClass('active').next('ul').slideToggle(300);
    e.stopImmediatePropagation()
  });
};

Answer 1

JQUERY

$(el).removeAttr('tabindex');

IE8 +

el.removeAttribute('tabindex');

（非常好）页面被盗

http://youmightnotneedjquery.com/

将jQuery转换为JS

1 个答案: