減少來自課程或ID的冗餘呼叫/查找

Question

對於錯誤的標題或問題抱歉。但爲了讓它更容易理解，我在這裏有一個代碼，例如多次調用標題。下面的變量指定要克隆的元素，即#header a[href=$="programs"]。 ID #header在我的部分代碼中被多次調用。有沒有辦法調用它一次，並將其插入我的代碼的一部分，而不是手動添加它。我還是新來的JavaScript。

我希望儘管我對編程缺乏瞭解，我仍然設法解釋它。

var programsMenu = []; 
     programsMenu.push($('#header a[href$="/programs"]').clone()); 
     programsMenu.push($('#header a[href$="/programs"]').next().clone()); 


    var degreesMenu = []; 
     programsMenu.push($('#header a[href$="/programs"]').clone()); 
     degreesMenu.push($('#header a[href$="/degree-programs"]').clone()); 
     degreesMenu.push($('#header a[href$="/degree-programs"]').next().clone()); 

---

(function ($) { 
    'use strict'; 


    var footerNavigation = { 
     init : function() { 

      var programsMenu = []; 
       programsMenu.push($('#header a[href$="/programs"]').clone()); 
       programsMenu.push($('#header a[href$="/programs"]').next().clone()); 


      var degreesMenu = []; 
       programsMenu.push($('#header a[href$="/programs"]').clone()); 
       degreesMenu.push($('#header a[href$="/degree-programs"]').clone()); 
       degreesMenu.push($('#header a[href$="/degree-programs"]').next().clone()); 

      $('#footer .programs-menu .degree').append(degreesMenu); 

      var nonDegreeMenu = []; 
       nonDegreeMenu.push($('#header a[href$="/executive-education-programs"]').clone()); 
       nonDegreeMenu.push($('#header a[href$="/development-education-programs"]').clone()); 
       nonDegreeMenu.push($('#header a[href$="/program-schedules"]').clone()); 

      $('#footer .programs-menu .non-degree').append(nonDegreeMenu); 

      var schoolMenu = []; 
       schoolMenu.push($('#header a[href$="/schools"]').clone()); 
       schoolMenu.push($('#header a[href$="/schools"]').next().clone()); 

       $('#footer .schools-faculty-menu .schools').append(schoolMenu); 


      var facultyMenu = []; 
       facultyMenu.push($('#header a[href$="/faculty-and-staff"]').clone()); 
       facultyMenu.push($('#header a[href$="/faculty-and-staff"]').next().clone()); 

       $('#footer .schools-faculty-menu .faculty').append(facultyMenu); 

      // var researchMenu = []; 
      //  researchMenu.push($('a[href$="/research-centers"]').clone()); 
      //  researchMenu.push($('a[href$="/research-centers"]').next().clone()); 

      var researchCenters = $('#header a[href$="/research-centers"]').next().clone(), 
       centersList  = $('li', researchCenters), 
       research   = $('#footer .research-centers-menu .research'), 
       publications  = $('#footer .research-centers-menu .publications'), 
       publicationsMenu = $('<ul class="menu" />').appendTo(publications), 
       researchMenu  = $('<ul class="menu" />').appendTo(research), 
       centers   = centersList.slice(0, 6), 
       resources  = centersList.slice(6); 

      //Store Research anchor and AIM Research Centers 
      var aimResearchCenters = []; 
       aimResearchCenters.push($('#header a[href$="/research-centers"]').clone()); 
       aimResearchCenters.push($(researchMenu.append(centers))); 

      //Append aimResearch array 
      $('#footer .research-centers-menu .research').append(aimResearchCenters); 

      publicationsMenu.append(resources); 


      /* 
      $('#footer .research-centers-menu .research').append(centers); 
      $('#footer .research-centers-menu .publications').append(resources); 
      */ 


      var aboutMenu = []; 
       aboutMenu.push($('a[href$="/about-us"]').clone()); 
       aboutMenu.push($('a[href$="/about-us"]').next().clone()); 

      $('#footer .about-menu .about').append(aboutMenu); 


      //Duplicate Breadcrumns on header and insert it on footer 
      var breadcrumbs = $('.region-breadcrumb').clone(); 
      $('.region-breadcrumb').clone().insertAfter('#footer .footer-head'); 
     } 
    } 

    $(document).ready(function() { 
     footerNavigation.init(); 
    }) 

})(jQuery); 

Answer 1

您可以使用一個變量來進行jQuery的元素。

這不僅可以縮短代碼並使其更具可讀性......
它還減少了對文檔的jQuery查找以查找元素，使代碼更有效。

像：

var programs = $('#header a[href$="/programs"]'); 
var degrees = $('#header a[href$="/degree-programs"]'); 
var schools = $('#header a[href$="/schools"]'); 

// and so on...