3

我试图通过从缓存的文本文件中提取并循环浏览推文来显示 Twitter 提要。工作正常,直到我尝试将这些推文变成一个列表。li 元素正确地附加到 innerHTML,但开头的 ul 自动关闭,结尾的 ul 消失了。

function twitterStatusCallback(obj) {
   if(obj && obj.length){
       document.getElementById('twitter_status').innerHTML += "<ul>";
       var len = obj.length;

      for(var i = 0; i < len; i++){
    //Only get tweets less than 7 days old.
    if ((relativeTimeNumeric(obj[i].created_at)) < (8*24*60*60)) { 

    var tweet = obj[i];

        document.getElementById('twitter_status').innerHTML += "<li>" + linkify(tweet.text);
        document.getElementById('twitter_status').innerHTML += relativeTime(tweet.created_at) +"</li>";

   }
   }
  document.getElementById('twitter_status').innerHTML += "</ul>"; 
}
 }
4

3 回答 3

5

如何构建一个字符串,然后在它完全构建后将其分配给innerHTML(这样您就永远不会注入损坏的html)。一点一点地把坏掉的 html 烧到浏览器里肯定会出问题,因为浏览器不能存储坏掉的 dom 树。

于 2012-04-12T00:09:48.627 回答
1

这可能是浏览器特定的问题。我建议先为 innerHTML 构造一个字符串,然后在函数末尾分配它。

IE:

var temp = "<ul>";
temp += "<li">;

etc...

document.getElement.innerHTML = temp;
于 2012-04-12T00:10:36.140 回答
1

更干净

​var ul=document.createElement('ul');
for(i=0;i<len;i++)
{
    var li=document.createElement('li');
    li.innerHTML=linkify(tweet.text)+" "+relativeTime(tweet.created_at);
    ul.appendChild(li);
}

document.getElementById('twitter_status').appendChild(ul);

这里有一个例子。

于 2012-04-12T00:29:53.167 回答