使用Javascript将RSS标题解析为HTML [英] Parse RSS title into HTML using Javascript

查看:78
本文介绍了使用Javascript将RSS标题解析为HTML的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我试图用我们网站的RSS新闻源使用Javascript(例如jQuery - 我们已经导入v.1.9.1)中的5个最新主题填充网页上的菜单,并且我一直在这里搜索内容以查找有些工作,但最适合我的问题的答案似乎是使用废弃的脚本。



RSS源存储在我们自己的服务器上,因此应该确保阅读权限。我更喜欢使用某种类型的Javascript,并且我只需要拥有诸如最新的X新闻及其链接被放入

 < li>< a href =链接到文章>第一新闻标题< / a>< / li> 
< li>< a href =链接到文章>第二个新闻标题< / a>< / li>

这里的答案之一让我想起了这个JSfiddle:代码但它似乎没有工作?在这里代码中的另一个答案给出了一个jQuery代码,我不知道如何利用我的HTML之后,所以它可能会简单的指导我使用这个?



我使用JS的经验非常有限,所以我会非常感谢一些关于如何让事情工作的低技术建议无论是包含在.js文件中的内容以及如何让它出现在我的HTML中。



新闻提要在这里:链接



谢谢!

解决方案

根据您发现的答案好吧,为了测试的目的,我放了一个 jsfiddle (请注意,我在小提琴中使用了预定义的XML字符串,因为我无法访问域中的RSS提要)



代码解释

简单HTML:

 < ul id = 进料 > 
< / ul>

Javascript:

  $(document).ready(function(){

var x = 10; //您的X迭代限制

//载入xml数据。它由jquery
$ .get(http://www.flatpanels.dk/rss/nyhed.xml,function(data){
var $ xml = $(data);

$ xml.find(item)。each(function(i,val){//找到rss和循环中的项目

//创建一个项目对象与所有必要的信息从xml
var $ this = $(this),
item = {
title:$ this.find(title)。text(),
link:$ this.find(link)。text(),
描述:$ this.find(description)。text(),$ b $ pubDate:$ this.find( (),
guid:$ this.find(guid)。text()
};
//替换项目标题
item.title = ite中的CDATA m.title.replace(<![CDATA [,).replace(]]>,);

// #feed选择id元素为
的ul元素// append()将新创建的li元素
//添加到ul
$ ('#feed')。append($('< li>< a href ='+ item.guid +'>'+ item.title +'< / a>< / li>' ));

return i <(x-1); //(在x次迭代后停止)
});
});
});


I am trying to populate a menu on a webpage with the 5 latests topics from our site's RSS newsfeed using Javascript (e.g. jQuery - we import v. 1.9.1 already), and I have been trawling the content in here to find something that work, but the answer most suiting my problem seems to be using deprecated scripts.

The RSS feed is stored on our own server, so reading rights should be ensured. I would prefer using Javascript of some sort and I simply need to have the titles of e.g. the latest X news and their links tossed into

<li><a href="Link to article">first news header</a></li>
<li><a href="Link to article">second news header</a></li>

One of the answers in here led me to this JSfiddle:Code but it doesn't seem to work? Another answer in here code gives a jQuery code that I have no clue how to utilize in my HTML afterwards, so it might as simple as guiding me to the use of this?

I have very limited experience using JS, so I would greatly appreciate some pretty low-tech advice on how to get things working both in terms of what to include in a .js file and how to make it appear in my HTML afterwards.

The news feed is here:Link

Thanks!

解决方案

Based on the answer you found as well, I put together a jsfiddle for testing purposes. (note that I'm using a predefined XML string in the fiddle since I can't access the RSS feed on the domain)

Here's the code explanation

Simple HTML:

<ul id="feed">
</ul>

Javascript:

$(document).ready(function(){

var x=10; // your X iteration limit

// load the xml data. it is parsed by jquery
$.get("http://www.flatpanels.dk/rss/nyhed.xml", function(data) {
    var $xml = $(data);

    $xml.find("item").each(function(i, val) { // find the items in the rss and loop

        // create an item object with all the necessary information out of the xml
        var $this = $(this),
            item = {
                title: $this.find("title").text(),
                link: $this.find("link").text(),
                description: $this.find("description").text(),
                pubDate: $this.find("pubDate").text(),
                author: $this.find("author").text(),
                guid: $this.find("guid").text()
        };
        // replace the CDATA in the item title
        item.title = item.title.replace("<![CDATA[", "").replace("]]>", "");

        // #feed selects the ul element with the id feed
        // and append() appends a newly created li element
        // to the ul
        $('#feed').append($('<li><a href="' +item.guid +'">' +item.title +'</a></li>'));

        return i<(x-1); // (stop after x iterations)
    });
});
});

这篇关于使用Javascript将RSS标题解析为HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆