ニュースappメモ (Google Feed APIを使用してRSSを読み込む)
2014年10月11日
ニュースappメモ (Google Feed APIを使用してRSSを読み込む) 比較
ニュースappメモ (Google Feed APIを使用してRSSを読み込む)
国際( Japan World on Huffington Post Japan )
の「http://www.huffingtonpost.jp/news/japan-world/feed/」を使った「2つの表現」です。
(1) 表現
(2) プログラム(スクリプト)の確認
どっちが 好みかな?
参考 サイト
/////
国際
Japan World on Huffington Post Japan
/////
上の例
/////
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
上の2つ以外の「シンプル」形式 例
最近の「気になる国際ニュース」
//////
Google Feed API +画像 の可能性
/////
画像入りのRSSの例
/////
国際( Japan World on Huffington Post Japan )
の「http://www.huffingtonpost.jp/news/japan-world/feed/」を使った「2つの表現」です。
(1) 表現
(2) プログラム(スクリプト)の確認
どっちが 好みかな?
参考 サイト
上の技術
下の技術
/////
Feed表示
/////
国際
Japan World on Huffington Post Japan
/////
上の例
/////
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script>
google.load("feeds", "1");
function initialize() {
var feedurl = "http://www.huffingtonpost.jp/news/japan-world/feed/"; // FeedのURL
var feed = new google.feeds.Feed(feedurl);
feed.setNumEntries(10); //表示させる件数
feed.load(function (result){
if (result.error){
alert(result.error.code + ":" + result.error.message);
return;
}
htmlstr = "";
htmlstr += '<h1><a href="' + result.feed.link + '">' + result.feed.title + '</a></h1>';
htmlstr += '<p>説明 :' + result.feed.description + '</p>';
htmlstr += '<p>作成者 :' + result.feed.author + '</p>';
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
htmlstr += '<h2><a href="' + entry.link + '">' + entry.title + '</a></h2>';
htmlstr += '<p>' + entry.contentSnippet + '</p>';
htmlstr += '<p>日付 :' + entry.publishedDate + '</p>';
htmlstr += '<p>カテゴリ :';
for (var j = 0; j < entry.categories.length; j++) {
htmlstr += '[' + entry.categories[j] + ']';
}
htmlstr += '</p>';
}
document.getElementById("feed").innerHTML = htmlstr;
});
}
google.setOnLoadCallback(initialize);
</script>
Feed表示
<hr>
<div id="feed"></div>
<hr>
//////
下の例
//////
国際
//////
参考 サイト//////
下の例
//////
国際
Japan World on Huffington Post Japan
<script type="text/javascript" src="http://rss.tc/feed/RssReader.aspx?url=http%3a%2f%2fwww.huffingtonpost.jp%2fnews%2fjapan-world%2ffeed%2f&displayRow=15&dispTitle=1&dispTime=0&id=20140913164236&target=_top&sbm=0&skin=Green"></script><div style="font-size: 75%; text-align: right; line-height:200%;">Powered by <a href="http://rss.tc/" target="_top"><img src="http://rss.tc/images/rsstcicon.gif" alt="RSSリスティング" style="border:0; width:80px; height:15px;vertical-align: middle;" /></a></div>
//////
上の技術
下の技術
//////上の2つ以外の「シンプル」形式 例
最近の「気になる国際ニュース」
//////
Google Feed API +画像 の可能性
/////
画像入りのRSSの例
/////
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script>
google.load("feeds", "1");
function initialize() {
//フィードの取得
var feed = new google.feeds.Feed("http://rss.allabout.co.jp/aa/latest/ch/mobile/");
//エントリの表示数の設定
feed.setNumEntries(10);
//関数の定義
feed.load(function(result) {
if (!result.error) {
//読み込みが成功したときの処理
var container = document.getElementById("feed");
var htmlstr = "";
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];
//日付の取得
var pdate = new Date(entry.publishedDate); //Dateクラス
var pyear = pdate.getFullYear(); //年
var pmonth = pdate.getMonth() + 1; //月
var pday = pdate.getDate(); //日
//日付を2桁表示に変更
if (pyear < 2000) pyear += 1900;
if (pmonth < 10) {pmonth = "0" + pmonth;}
if (pday < 10) {pday = "0" + pday;}
var date = pyear + "." + pmonth + "." + pday + " ";
//画像の取得
imgsrc = entry.content.match(/src="(.*?)"/igm);
//html生成
htmlstr += '<li><a href="' + entry.link + '">';
htmlstr += '<div class="thum"><img ' + imgsrc + ' width="95" height="75"></div>';
htmlstr += '<p class="info">' + date + '| ' + entry.categories[0] + '</p>';
htmlstr += '<p class="tit">' + entry.title + '</p></a></li>';
}
container.innerHTML = htmlstr;
} else {
//読み込みが失敗したときの処理
alert(result.error.code + ":" + result.error.message);
}
});
}
google.setOnLoadCallback(initialize);
</script>
Feed表示
<hr>
<div id="feed"></div>
<hr>
rikezyo00sumaho at 07:07|Permalink│Comments(0)