上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

[CSS] コメントを記載

CSSでコメントを記載する際に、単一行コメントの書き方が
間違えがちだったので忘れないようにメモ。

コメントは、「/*」と「*/」で囲んで記載する。
そうすることで、ブラウザ側で無視される。

「//」ではコメントとはならないので注意。
(Javaとかの癖で間違えそう・・・)


ちなみに、「*/」の直前に全角文字を記載するのはダメみたい。
この点も注意する必要がある。


[Javascript]ブログの更新情報をGoogleFeedAPIを使用して取得する

[Javascript]ブログの更新情報をGoogleFeedAPIを使用して取得する


よく、ホームページやブログなどに他のブログの最新の更新情報が表示されているのを見かけるが、
これは、RSSフィードを使用すれば簡単に実現できる。

大雑把にいうと、
JSON、XMLなどの形式でデータを取得して、パースされたデータを整形して表示するだけ。

自前でパース処理を実装したりするとちょっと大変だけど、「Google Feed API」を
使用すれば、指定したフィードのURLから取得してキーごとに分解してくれるところまで
やってくれる。

あとは、分解されたデータを自前で整形して出力するだけ。


■参考サイト
JavaScript Reference - Google Feed API
https://developers.google.com/feed/v1/reference?hl=ja


■このブログのフィードでお試しの実装
<html>
<head>
<title>RSSで最新情報を表示</title>
<script src="https://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
var feedUrl = "http://memo755.blog.fc2.com/?xml"; //RSS feed の URL

google.load("feeds", "1");

function initialize() {
var html = '';
var feed = new google.feeds.Feed(feedUrl);

feed.setNumEntries(3); //表示件数を設定(デフォルトは4件)
//フォーマットにJSONとXMLをの混合を指定、指定なしだとJSONになる
feed.setResultFormat(google.feeds.Feed.MIXED_FORMAT);
feed.load(function(result) {
if (!result.error){
var container = document.getElementById("feed"); //最新情報の挿入箇所のを取得
var items = result.xmlDocument.getElementsByTagName("item");
for (var i = 0; i < result.feed.entries.length; i++) {
var entry = result.feed.entries[i];

var title = entry.title; //記事タイトル取得
var link = entry.link; //記事のリンクを取得

//日付を取得し年月日を整形
var element = google.feeds.getElementsByTagNameNS(items[i], "http://purl.org/dc/elements/1.1/", "date")[0];
var date = element.firstChild.nodeValue;
var pubDD = new Date(date);
var yy = pubDD.getYear();
if (yy < 2000) yy += 1900;
var mm = pubDD.getMonth() + 1;
var hh = pubDD.getHours();
var min = pubDD.getMinutes();
var ss = pubDD.getSeconds();
dd = pubDD.getDate();
var pubDate = yy +'/'+ mm +'/'+ dd + ' ' + hh + ':' + min + ':' + ss;

//表示する部分を整形
html += '<div>' + pubDate + '<br><a href="' + link + '" target="_blank">' + title +'</a></div>';
}
container.innerHTML = html;
}
});
}
google.setOnLoadCallback(initialize);
</script>
</head>
<body>
<div id="feed">
</div>
</body>
</html>


今回は、データをJSONとXMLの混合した形式で取得している。
デフォルト(指定なし)は、google.feeds.Feed.JSON_FORMATとなる。
  • google.feeds.Feed.JSON_FORMAT ⇒ JSON形式
  • google.feeds.Feed.MIXED_FORMAT ⇒ JSON形式とXML形式の混合
  • google.feeds.Feed.XML_FORMAT ⇒ XML形式


  • プロフィール

    hiiro

    Author:hiiro

    最新記事
    カテゴリ
    月別アーカイブ
    最新コメント
    最新トラックバック
    検索フォーム
    RSSリンクの表示
    リンク
    ブロとも申請フォーム

    この人とブロともになる

    QRコード
    QR
    Counter
    上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。