javascript简单while循环不添加到innerHtml

时间:2011-10-20 14:43:15

标签: javascript html dom loops

好的,这是我的愚蠢问题。我在这里学习和...我一直在看这个,我不明白。我有一个数组,其中包含一些通过对象提供的值。像这样:

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++;
    }
}

它只显示数组的最后一个值。它不会循环其余的数组值。 我正在做的就是用getElementById等替换.write。

3 个答案:

答案 0 :(得分:6)

在每次迭代中,您覆盖(重新分配)innerHtml的值'showMore'

使用+=代替追加(添加到){strong>当前存在的内容'showMore'

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

旁注

我还希望您在这种情况下使用 for 循环,因为您循环遍历静态数组,其中您需要迭代的次数已知< / strong>从一开始

blogRun.length

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

答案 1 :(得分:3)

innerHTML替换元素的完整内容。

这应该会更好用

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

答案 2 :(得分:2)

.innerHtml将替换每个循环中元素showMore中的值。如果您希望showMore显示所有值,您需要将值附加/连接在一起,然后替换innerHtml。

或者你应该能够简单地将mssgs值附加到innerHtml:

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