【问题标题】:reformating an RSS feed with jQuery使用 jQuery 重新格式化 RSS 提要
【发布时间】:2011-07-05 14:13:45
【问题描述】:

我目前正在拉取 RSS 提要,其中格式本质上是标题->图像->文本内容。我想重新格式化它,以便图像首先出现。我目前正在尝试:

<script type="text/javascript">
    $(document).ready(function() {
$("li.rssitem").each(function() {
$(".rssdescription a img").remove().insertBefore("h3");
    });
    });
</script>

HTML 看起来像:

<ul id="rssitems">

<li class="rssitem"><h3 class="rsstitle"></h3>
<div class="rssdescription"><p><a href="#"><img src="..."></a></p><p>content</p></div></li>

<li class="rssitem"><h3 class="rsstitle">><a href="#">...</a></h3>
<div class="rssdescription"><p><a href="#"><img src="..."></a></p><p>content</p></div></li>

</ul>

除了列表中有许多项目(全部带有图像)外,其他方法都有效。此代码将所有图像放在所有 h3 之前。我显然无法正确循环。非常感谢大家!

【问题讨论】:

    标签: jquery rss reformat


    【解决方案1】:

    试试这个代码:

    $("li.rssitem").each(function() {
        var target = $(this).children("h3");
        $(this).find("img").each(function() {
            $(this).remove();
            $(target).before($(this));
        });    
    });
    

    我没有对其进行测试,因此我不确定它是否可以开箱即用,但希望您能够对其进行修改以满足您的需求。

    【讨论】:

    • 感谢您的尝试,但唉,它似乎没有做任何事情。我还认为这应该可以解决问题:$("li.rssitem").each(function() { var target = $(this).filter("h3"); $(".rssdescription a img").each(function() { $(this).remove(); $(target).insertBefore(this); }); }); 将 .before 更改为 .insertBefore 并在 img 之后关闭括号。还没去
    • 我明白了;)我用工作代码编辑了我的答案! filter() 不是调用的好方法,要在元素的子元素中搜索,我们必须使用 find()
    【解决方案2】:

    问题在于循环内部的选择器。它正在查找所有 img 标签,而不仅仅是所需的 li.rssitem 中的标签。

    <script type="text/javascript">
        $(document).ready(function() {
            $("li.rssitem").each(function() {
                $(this).find(".rssdescription a img").insertBefore("h3");
            });
        });
    </script>
    

    如果这能解决您遇到的问题,请告诉我。

    更新:去掉 remove() 因为它会搞砸你。谢谢 DT。

    【讨论】:

    • 我认为您不需要remove() 步骤,insertBefore() 将根据api link 将元素移动到新位置(而不是克隆它)。
    • 很高兴能提供帮助 :) (另外,如果您回复某人,最好在他们的名字前加上 @ 符号,这样它会通知您正在回复的人... ) +1 =)
    • 感谢@David Thomas!一段时间以来,我一直在使用 Stack Overflow 作为学习资源,现在才刚刚开始帮助他人。作为一般规则,当我在 Google 上搜索技术问题时,我会输入“+stack”以确保我找到了正确的问题/答案。 :)
    • 't 是个好方法!请记住,提问与提供答案一样有用... =)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-02-15
    • 1970-01-01
    • 1970-01-01
    • 2015-11-25
    • 1970-01-01
    • 2011-08-29
    • 2011-05-29
    相关资源
    最近更新 更多