Javascript两个“ For”循环循环可从3个数组中获取数据

Question

I have three arrays one title array with 10 elements, 2nd subtitle array with 121 elements and 3rd description array with 121 elements, i need to display it in a list where i put in this format:

  ---Title
    ---subtitle[0]----listequivalent[0]
    ----subtitle[1]-----list equivalent[1]
    ---subtitle..etc
    ---------------------
    ----title 2
   ---- subtitleofthis[2]-----descriptionEquivalent[2]   
    ----subtitleofthis[3]-----descriotionEquivalent[3] subtitleofthis...etc
    ---------------------

i have this:

   for(var j=0;j<titles.length;j++){

    $("#divisionTitles").append("<div  class='content-block-title'>" + titles[j] + "</div>");


   for(var i=0;i<subtitle.length;i++){


    $("#divisionTitles").append(" <ul>"+
            "<li class='item-link item-content'>"+
            " <a href='=" + description[i] +"'"  + ">"+
    "<div class='item-inner'>"+
     "<div class='item-title'>"+ subtitle[i] +"</div>"+
    "</div>"+
    "</a>"+
    "</li>"+
    "</ul>");

  }
}

but it shows like this:

---title
---subtitle[all] //all from 1 to 121 with the descriptions 1 to 121
--- title 2
--- subtitle[all] //all from 1 to 121 with the descriptions 1 to 121

Answer 1

Because it's exactly what are you telling it to do - "translated" it to more human language, it'll look something like:

for each title print all the subtitles

You would need something like

fore each title print all the MATCHING subtitles

that means you would have to change your structure a bit (eg. have array where each element of such array would be object containing title and another array containing every matching subtitles)

Or if you for some reason need to preserve your structure you may do something like this:

for each title do following:
    read all the subtitles and if it's matching print it

that means you will add one if in your inner for , that means it'll be looking like this:

for(var j=0;j<titles.length;j++){

    $("#divisionTitles").append("<div  class='content-block-title'>" + titles[j] + "</div>");


   for(var i=0;i<subtitle.length;i++){


       if(subtitle is matching) {
           /* I don't know how the code should find out which
            * title does this subtitle matching because of this
            * i'm not putting exact code in the if but only a psedocode
            */


         /*** do your stuff here ***/
       }
   }
}