1

我正在尝试制作一个网页，该网页从播客中获取 XML 文件并生成所有标题的列表以及指向播客的直接链接。在大多数情况下，这是可行的，但是当我尝试使用 CSS 向页面添加样式时，它就会消失，因此页面就像一开始没有应用任何样式时一样。

这是我正在使用的在页面上写入列表的一段 JavaScript。

var podcasts;
var titles = new Array;
var urls = new Array;

var yogpod = function() {

    document.write("<h1> YogPod </h1>");

    var xml = loadXMLDoc("http://localhost/yogpod/yogpod.xml");
    podcasts = xml.getElementsByTagName("item");

    //Extract info into arrays for ease of use
    for (i=0; i<podcasts.length; i++)   {   titles[i] = podcasts[i].children[0].textContent         }
    for (i=0; i<podcasts.length; i++)   {   urls[i] = podcasts[i].children[6].getAttribute('url')   }


    //Make podcast 1 first
    titles.reverse();
    urls.reverse();

    //Write podcasts and URLs on page
    for (i=0; i<podcasts.length; i++)
    {
        var div = document.createElement('div');
        //div.setAttribute('class', 'podcast');
        div.className='podcast';
        var titleText = document.createTextNode(titles[i]);
        var urlText = document.createTextNode(urls[i]);

        div.appendChild(titleText);
        div.appendChild(document.createElement('br'));
        div.appendChild(urlText);
        div.appendChild(document.createElement('br'));

        var a = document.getElementsByTagName('body')[0];
        a.appendChild(div); 
    }
}

这就是结果，与 Chrome 认为的页面一样。 标记

编辑：我删除了这 document.write("<h1> YogPod </h1>") 条线并修复了它。谁能告诉我这是为什么？

4

2 回答 2

5

当您在页面加载document.write 后执行 a 时，它会在写入指定内容之前清空文档。document.write用document.createElement("h1")和替换document.body.appendChild(...)

于 2013-10-04T22:04:53.010 回答
0 
       // you have to create new element and new textNode


var s = document.createElement('h1');
var t = document.createTextNode('yodu..');

var headr = s.appendChild(t);
于 2013-10-04T18:35:02.223 回答