JavaScript-编写未显示的html元素？

Question

I'm trying to write some code in javascript that uses a user's cookies to display a box containing some information. The page opens with some boxes containing news articles from Google News RSS feeds. I'm using a 3rd party app for the RSS; the feed is included in the HTML code as such:

<script language="JavaScript" src="http://www.feedroll.com/rssviewer/feed2js.php?src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed"  charset="UTF-8" type="text/javascript"></script>

The user can move the boxes around, and I want to store the box locations using cookies so that if a user revisits the page, the boxes will be in the same location. However, when I try to load the page from the information in the cookies, the boxes are blank. This is an example of what my code looks like (RSS feed for news using keyword "Barack Obama"):

// Render boxes into HTML
function renderItem(container) {
    var wrapper = document.getElementById(container);

    var div_box = document.createElement('div');

    var feed_url = 'http://www.feedroll.com/rssviewer/feed2js.php src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed';

    var div_box_feed = document.createElement('div');
    var feed_script = document.createElement('script');
    feed_script.setAttribute('language', 'JavaScript'); 
    feed_script.setAttribute('src', feed_url);
    feed_script.setAttribute('charset', 'UTF-8');
    feed_script.setAttribute('type', 'text/javascript');

    div_box_feed.appendChild(feed_script);
    div_box.appendChild(div_box_feed);

    wrapper.appendChild(div_box);
}

When the page loads, the box appears but the news articles from the RSS feed are not there and the box is empty. When I look at the source code, however, it is identical to the code of the initial boxes (which did display the news articles).

Does anybody know what's wrong?

Thanks!

Answer 1

You never declared column_div here:

wrapper.appendChild(column_div);

Did you mean:

wrapper.appendChild(div_box);

?

Answer 2

I believe that by default script elements created in this manner have their async attribute set to true , so the rest of your code will execute before your JS has been retrieved.

Where does the column_div variable come from?

Answer 3

You're missing a question mark to separate the post variables from the URL, so the URL is resolving to

var feed_url = 'http://www.feedroll.com/rssviewer/feed2js.php%20src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed';

It should be

var feed_url = 'http://www.feedroll.com/rssviewer/feed2js.php?src=http%3A%2F%2Fnews.google.com%2Fnews%3Fq%3Dbarack%2Bobama%26output%3Drss&num=4&date=y&targ=y&utf=y&css=feed'