ajax请求在do ... while循环中断，这是可能的

Question

我想检索json ajax数据并将它们放入日历单元格中。 该月的单元格由do...while循环动态生成。我在生成单元格之前首先检索数据，然后将它们存储在一个数组中（myPref包含日期数据）。

正在生成单元格时，如果div中的date与单元格的myPref匹配，我想在单元格中创建date元素。

我的问题是当我在do...while循环中调用数组时，它会重复多次，就像本月有几天一样。因此，无法使用myPref中的数据。

如果有人可以帮助我，他会救我。我正在研究它两个星期。谢谢。  这是我的代码：

              // here  my ajax request start  
        var pref = {};
        pref.get = function (url, data, succes, error){
            var xhr = new XMLHttpRequest();
            xhr.open('GET',url);
            xhr.onreadystatechange = function(event){
                   //console.log(xhr.readyState)
                if(xhr.readyState == 4){
                    if(xhr.status >= 200 && xhr.status <= 300){
                         /* console.log('Good...')
                         console.log(JSON.parse(xhr.responseText))
                          console.log(xhr.getAllResponseHeaders())*/
                        succes(xhr.responseText);
                    }
                    else{
                         //console.log("Bad Request !!!")
                        error(xhr.status,xhr.statusText, xhr);
                    }
                }
            };
            xhr.send();
        };

        pref.get('/preferences', null,succes, error);
         //console.log(pref.get)
        console.log(pref.get)
        var myPref = []
        function succes (data){
            var d = JSON.parse(data);
            for(var i=0;i<d.length;i++){
                var out = d[i].date
                myPref.push(out);
            }

        }
        function error(err){
            console.log(err)
        }

        //start to create the table
        var html = '<table id="tek" class="ui celled table">';

       // Write selected month and year
        html += '<thead><tr>';
        html += '<th colspan="7">' +"Calendrier" + '</th>';
        html += '</tr></thead>';



        // Write the header of the days of the week
        html += '<tr >';
        for(var i=0; i < this.JourSem.length;i++) {
                html += '<td class="ndays">' + this.JourSem[i] + '</td>';
        }
        html += '</tr>';

             // Write the days

        var i=1;
        do {
                var dow = new Date(y, m, i).getDay();
                    // If sunday, satrt the row
                if ( dow ==0) {
                        html += '<tr>' ;
                }
                        // if not sunday, write fisrt of the month
                        // write also the days of the previous month
                else if ( i == 1 ) {
                        html =html+ '<tr class="vak">';
                        var k = derJourDerMois - premJourMois+1;
                        for(var j=0; j < premJourMois; j++) {
                                html += '<td class="yow"><p>'+ '</p></td>';
                                k++;
                        }
                }
                     // Write the current day in the loop
                var chk = new Date();
                var chkY = chk.getFullYear();
                var chkM = chk.getMonth();
                if (chkY == this.anneeActuel && chkM == this.moisActuel && i == this.auj) {
                        html += '<td class="today" ><p>' + i +'</p></td>';console.log(chkM);
                }
                else {
                    html += '<td id="td" class="jour_normal"  >'
                    html += '<div class="blokp">' + i+' '+ this.Mois[m]+' '+this.anneeActuel + '</div>'; 
                    html += '<div class="events"><ul >'
                    var dato = this.anneeActuel+'-'+0+(this.moisActuel+1)+'-'+i;
                    myPref.forEach(function(el){
                        if(el==dato){
                           html+='<li class="pref"></li></ul></div></td>';
                        }
                    })
                }
// if Saturday, close the row
                if ( dow == 6 ) {
                        html += '</tr>';
                }
// If not Saturday, but last day of the selected month
// it will write the next few days from the next month
               else if ( i == derJourMois ) {
                        var k=1;
                        for(dow; dow < 6; dow++) {
                               html += '<td class="not-current"><p>' +   '<p></td>';
                               k++;

                        }
                }

                i++;
            }
            while(i <= derJourMois);

           // Close table
            html += '</table>';

           // Write HTML to the div
            document.getElementById(this.divId).innerHTML = html;
          };