javascript - 使用 Javascript 从 Atom feed 中提取图像源

标签 javascript google-api blogger

我正在为 Blogger 网站开发一个小工具。 我想使用 Javascript 获取网站提要(Atom)中带有特定标签的前四篇文章的标题、链接和第一张图片。 到目前为止,我已经从这些帖子中获得了标题和链接,并在小工具中以 HTML 形式显示。这是代码:

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
<ModulePrefs title="Retrieve Featured Blog Posts" height="150" author="John Behan" />
<Content type="html">
    <![CDATA[
        <script type="text/javascript" src="http://www.google.com/jsapi"></script>
        <script type="text/javascript">
            google.load("feeds", "1");              
        </script>
        <script type="text/javascript">
            function initialize() {

                var feed = new google.feeds.Feed("http://test-ohomind.blogspot.com/feeds/posts/default/-/featured");
                feed.load(function(result) {
                    if (!result.error) {
                        var container = document.getElementById("feed");
                        for (var i = 0; i < result.feed.entries.length; i++) {
                            var entry = result.feed.entries[i];

                            var myElement = document.createElement('div');
                            var content = entry.content;
                            myElement.innerHtml = content;

                            var imagesrc = myElement.getElementsByTagName("img")[0].src;

                            var mydiv = document.getElementById("mydiv");
                            var newcontent = document.createElement('p');

                            newcontent.innerHTML = '<a href="' + entry.link + '">' + entry.title + '</a><br />' + imagesrc;

                            while (newcontent.firstChild) {
                                mydiv.appendChild(newcontent.firstChild);
                            }
                        }
                    }

                });
            }
            window.onload = initialize();
        </script>
            <body>

                <div id="mydiv">

                </div>
            </body>
    ]]>
</Content>
</Module>

上面的代码给出了一个空白的小工具和 Firebug 报告

myElement.getElementsByTagName("img")[0] is undefined

我尝试过稍微改变一下:

var imagesrc = myElement.getElementsByTagName("img");

在小工具中提供此信息

[object NodeList]

有人可以告诉我我做错了什么吗?我只需要获取第一张图像的源(src)。小工具的其余部分我可以完成,但这个小问题让我在现阶段完全感到沮丧。

提前致谢。

最佳答案

我在您的代码中注意到的一个潜在问题是您的 window.onload 实际上正在运行initialize() 脚本函数,而不是设置 window.onload = initializewindow.onload 。 onload = function(){initialize()}; 正如我相信你的意图。

鉴于您的代码在加载之前运行,这可以解释为什么 getElementsByTagName 没有提取任何内容

编辑:我还建议查看 Best practice for using window.onload最佳实践

关于javascript - 使用 Javascript 从 Atom feed 中提取图像源,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11147557/

相关文章:

javascript - 如何将 JQuery InputMask 与 HTML 模式一起使用

css - 我可以为博客上的 <pre> 添加背景吗?

html - 如何在 blogger 上为图像 css 添加边框

html - 仅在帖子中制作带下划线的链接

javascript - setTimeout 在循环中,它的行为与预期不同

来自毫秒和时区的Javascript日期

google-api - GA4 数据 API 何时会进入测试版?

python - 从我做过的 Gmail 中检索所有电子邮件,但只收到 3000 封电子邮件,不是全部

javascript - Firebug:在某些情况下省略输出

javascript - Rails/Google SSO - 导致 : Blocked a frame with origin 的身份验证弹出窗口