javascript простой цикл while, не добавляемый в innerHtml

Question

Хорошо, так что это моя глупая проблема. Я здесь учусь и ... я смотрел на это некоторое время, и я не понимаю. У меня есть массив с некоторыми значениями, которые передаются через объект. вот так:

function blogObj(name,date,user_entry){
    this.names = name;
    this.dates = date;
    this.blog_entry = user_entry;

    this.propsComb = this.names + this.dates + this.blog_entry;
}

var blogRun = [
        new blogObj("name ", "something ", "something "),
        new blogObj("name ", "something ", "something "),
        new blogObj("name ", "something ", "something "),
        new blogObj("name ", "something ", "something "),
        new blogObj("name ", "something ", "something "),


];

var i=0;
var mssgs = "";

Теперь, когда я перебираю это с помощью этого doc.write для проверки:

function hmm(){
    while(i < blogRun.length){ 
    mssgs = blogRun[i].propsComb + '<br/>';
    document.write(mssgs);

    i++;
    }
}

я получаю все нужные мне значения, которые называются как-то x5 согласно циклу и значениям массива. так по сути это работает.

теперь, когда я заменяю "document.write(mssgs)" на

document.getElementById('showMore').innerHTML = mssgs;

делает это

function hmm(){
    while(i < blogRun.length){ 
    mssgs = blogRun[i].propsComb + '<br/>';
    //document.write(mssgs);
    document.getElementById('showMore').innerHTML = mssgs;
    i++;
    }
}

показывает только последнее значение массива. он не зацикливается на остальных значениях массивов. все, что я делаю, это заменяю .write на getElementById и т. д.

Answer 1

На каждой итерации вы перезаписываете (переназначаете) значение innerHtml 'showMore'

используйте += вместо добавьте (добавьте к) текущее содержимое 'showMore'

document.getElementById('showMore').innerHTML += mssgs;

Примечание к сведению

Я бы также предпочел, чтобы вы использовали цикл for в этой ситуации, когда вы зацикливаетесь на статическом массиве, где количество повторений, которое вам нужно выполнить, составляет известно начало

(blogRun.length)

for ( var i = 0, len = blogRun.length; i < len; i++ ) {
    // .... do your stuff here.
}

Answer 2

innerHTML заменяет полное содержание вашего элемента.

это должно работать лучше

//before the while loop
var strHTML= '';
...
//inside while loop
strHTML += mssgs;
...
//after while loop
document.getElementById('showMore').innerHTML = strHTML;

Answer 3

.innerHtml заменит значение в элементе showMore в каждом цикле.Если вы хотите, чтобы showMore отображал все значения, вам нужно добавить / объединить значения вместе и затем заменить innerHtml.

Или вы сможете просто добавить значение mssgs к innerHtml:

document.getElementById('showMore').innerHTML += mssgs;