在网页中显示 RSS 提要:如何创建提要文章的链接?

问题描述 投票:0回答:0

我创建了一个显示 RSS 提要的网页(代码片段如下),但是,我正在努力让“阅读更多”链接自动从 RSS 提要加载每篇文章的 URL。

有什么想法吗?

代码如下:

<div class="card">
    <div class="thumbnail"><img src=""></div>
    <div class="text">
        <p class="title" id="title"></p>
        <p class="description" id="description"></p>
        <div class="link"><a href="">Read more</a></div>
        <p class="date" id="date"></p>
    </div>
</div>
<br>
<div class="card">
    <div class="thumbnail"><img src=""></div>
    <div class="text">
        <p class="title" id="title2"></p>
        <p class="description" id="description2"></p>
        <div class="link2"><a href="">Read more</a></div>
        <p class="date" id="date2"></p>
    </div>
</div>
<br>
<div class="card">
    <div class="thumbnail"><img src=""></div>
    <div class="text">
        <p class="title" id="title3"></p>
        <p class="description" id="description3"></p>
        <div class="link3"><a href="">Read more</a></div>
        <p class="date" id="date3"></p>
    </div>
</div>

<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
<script id="rendered-js" >
    $.ajax({
url: 'https://api.rss2json.com/v1/api.json', //converting it to JSON
method: 'GET',
dataType: 'json',
data: {
rss_url: 'http://feeds.bbci.co.uk/news/world/rss.xml', //RSS FEED
count: 10 //HOW MANY ITEMS TO GET
} }).
    done(function (response) {
        if (response.status != 'ok') {throw response.message;}
console.log('====== ' + response.feed.title + ' ======'); //GENERIC CONSOLE LOG TEST

var item = response.items[0]; //GET A SPECIFIC ITEM
var item2 = response.items[1]; //GET A SPECIFIC ITEM
var item3 = response.items[2]; //GET A SPECIFIC ITEM

console.log(item.title); 

var pubDate = item.pubDate; 
var link = item.link; 
var date = pubDate.slice(0, 10); 
$("#title").html(item.title); 
$("#description").html(item.description); 
$("#link").html(item.link); 
$("#date").html("Published: " + date); 

var pubDate2 = item2.pubDate; 
var date2 = pubDate2.slice(0, 10); 
$("#title2").html(item2.title); 
$("#description2").html(item2.description); 
$("#link2").html(item2.link); 
$("#date2").html("Published: " + date2); 

var pubDate3 = item3.pubDate; 
var date3 = pubDate3.slice(0, 10); 
$("#title3").html(item3.title); 
$("#description3").html(item3.description); 
$("#link3").html(item3.link); 
$("#date3").html("Published: " + date3); 

var thumb = response.feed.image; 
$("img").attr("src", thumb); 

}); 

    !function (a) {"use strict";a.fn.succinct = function (b) {var c = a.extend({ size: 240, omission: "...", ignore: !0 }, b);return this.each(function () {var b,d,e = a(this),f = /[!-\/:-@\[-`{-~]$/,g = function () {e.each(function () {b = a(this).html(), b.length > c.size && (d = a.trim(b).substring(0, c.size).split(" ").slice(0, -1).join(" "), c.ignore && (d = d.replace(f, "")), a(this).html(d + c.omission));});};g();});};}(jQuery); 

    //check browser size, truncate accordingly.
    $(document).ready(function () {
        // run test on initial page load
        checkSize(); 
        // run test on resize of the window
        $(window).resize(checkSize); 
    }); 
    //Function to the css rule 
    function checkSize() {
        if ($("img").css("max-width") == "300px") {
            $(function () {
                $('#description').succinct({
                    size: 150 }); 
            }); 
        } else {
            $(function () {
                $('#description').succinct({
                    size: 300 }); 
            }); 
        }
    }
</script>

我写了这段代码,但不幸的是,它让所有的 URL 都一样。如何让“阅读更多”链接显示每篇文章? :)

$("a").attr("href", item2.link); 

页面已经完成,我需要的只是“阅读更多”链接自动从 RSS 提要加载相关页面(这允许人们阅读新闻文章)。

javascript hyperlink rss href feed
© www.soinside.com 2019 - 2024. All rights reserved.