- ベストアンサー
こんな事は可能でしょうか?
こんな事は可能でしょうか? ターゲットとなるブログが3つあります。利用ブログは全てFC2です。 方法としてはそれぞれのブログからRSSを取得する事になると思うのですが いずれかのブログで3日以内に書かれているものがあるかを調べたいです。 そして3日以内に記事を書いているブログが1つでもあれば「NEW」と文字を 自分のサイトに表示させたく思っております。 ※3日以内の記事がない場合は何も表示しません javascriptだけで可能かどうかも不明な状態なのですが可能であれば方法を 教えてください!
- みんなの回答 (6)
- 専門家の回答
質問者が選んだベストアンサー
全角空白インデントし忘れちゃったので再度(見やすくした同じものです) <body> <div> <button onclick="blogchks();">Check</button> <dl id="result"></dl> </div> <script type="text/javascript"> <!-- var result=document.getElementById("result"); //↓にRSS Feed URLを複数セット var blogUrls=["http://feeds.fc2.com/fc2/xml?host=yclub.blog12", "RSS Feed URL 2", "RSS Feed URL 3" ] var entry_stack=[]; function blogchks(){ entry_stack.length=0; for(var i=0;i<blogUrls.length;i++) blogchk(blogUrls[i]); } function blogchk(feed_Url){ var api_Url='http://ajax.googleapis.com/ajax/services/feed/load?callback=_handleJson&v=1.0&output=json&num=6&q='; var apiScript=document.createElement("script"); apiScript.setAttribute("id","_handleJson"); apiScript.setAttribute("type","text/javascript"); apiScript.setAttribute("charset","UTF-8"); apiScript.setAttribute("src",api_Url + encodeURIComponent(feed_Url)); document.getElementsByTagName("head")[0].appendChild(apiScript); } function _handleJson(json){ if ( json.responseStatus != 200 ) return; while(result.hasChildNodes()) result.removeChild(result.firstChild); entry_stack.push(json.responseData.feed.entries); for(var i=0;i<entry_stack.length;i++){ result_write(entry_stack[i]); } document.getElementsByTagName("head")[0].removeChild(document.getElementById("_handleJson")); } function result_write(entries){ var today,pdate,dt,dd,a; today=new Date(); for(var i=0;i<entries.length;i++){ pdate=new Date(entries[i].publishedDate); if((today.getTime()-pdate.getTime())/24/3600/1000 > 3){ dt=document.createElement("dt"); dt.appendChild( document.createTextNode("New! ("+pdate.toLocaleString()+")") ); result.appendChild(dt); dd=document.createElement("dd"); a=document.createElement("a"); a.href=entries[i].link; a.appendChild( document.createTextNode(entries[i].title+"(by:"+entries[i].author+")") ); dd.appendChild(a); result.appendChild(dd); } } } // --> </script> </body> </html>
その他の回答 (5)
- yyr446
- ベストアンサー率65% (870/1330)
<試してみたところ2009年12月2日の記事でもNEWが表示されてしまいます^^;> はいそうです。サンプルですもん。 適当なブログがなかったので、あえて3日以上を出してます。 if((today.getTime()-pdate.getTime())/24/3600/1000 > 3){ この部分ですね。3日以内なら < 3 に直します。 <5件づつ取得し表示させかつ、3日以内の記事があればNEWを付加させたいです。 また、newmarkは複数のブログのうち1つでも3日以内の記事があれば表示させ 該当する記事がない場合には表示させない> については、最初の質問にはなかった追加要望ですね。 RSSを取得する部分は、前のサンプルが参考になりますので、 function result_write(entries){} の中で工夫してみて下さい。
- yyr446
- ベストアンサー率65% (870/1330)
おっと、複数やるんでした。これです↓(無駄な処理があるけど) <body> <div> <button onclick="blogchks();">Check</button> <dl id="result"></dl> </div> <script type="text/javascript"> <!-- var result=document.getElementById("result"); //↓にRSS Feed URLを複数セット var blogUrls=["http://feeds.fc2.com/fc2/xml?host=yclub.blog12", "RSS Feed URL 2", "RSS Feed URL 3" ] var entry_stack=[]; function blogchks(){ entry_stack.length=0; for(var i=0;i<blogUrls.length;i++) blogchk(blogUrls[i]); } function blogchk(feed_Url){ var api_Url='http://ajax.googleapis.com/ajax/services/feed/load?callback=_handleJson&v=1.0&output=json&num=6&q='; var apiScript=document.createElement("script"); apiScript.setAttribute("id","_handleJson"); apiScript.setAttribute("type","text/javascript"); apiScript.setAttribute("charset","UTF-8"); apiScript.setAttribute("src",api_Url + encodeURIComponent(feed_Url)); document.getElementsByTagName("head")[0].appendChild(apiScript); } function _handleJson(json){ if ( json.responseStatus != 200 ) return; while(result.hasChildNodes()) result.removeChild(result.firstChild); entry_stack.push(json.responseData.feed.entries); for(var i=0;i<entry_stack.length;i++){ result_write(entry_stack[i]); } document.getElementsByTagName("head")[0].removeChild(document.getElementById("_handleJson")); } function result_write(entries){ var today,pdate,dt,dd,a; today=new Date(); for(var i=0;i<entries.length;i++){ pdate=new Date(entries[i].publishedDate); if((today.getTime()-pdate.getTime())/24/3600/1000 < 3){ dt=document.createElement("dt"); dt.appendChild( document.createTextNode("New! ("+pdate.toLocaleString()+")") ); result.appendChild(dt); dd=document.createElement("dd"); a=document.createElement("a"); a.href=entries[i].link; a.appendChild( document.createTextNode(entries[i].title+"(by:"+entries[i].author+")") ); dd.appendChild(a); result.appendChild(dd); } } } // --> </script> </body> </html>
- yyr446
- ベストアンサー率65% (870/1330)
サンプルです。 全角空白は半角空白にしてね <body> <div> <button onclick="blogchks();">Check</button> <dl id="result"></dl> </div> <script type="text/javascript"> <!-- var result=document.getElementById("result"); //↓にRSS Feed URLを複数セット var blogUrls=["http://feeds.fc2.com/fc2/xml?host=yclub.blog12", "RSS Feed URL 2", "RSS Feed URL 3" ] function blogchks(){ for(var i=0;i<blogUrls.length;i++) blogchk(blogUrls[i]); } function blogchk(feed_Url){ var api_Url='http://ajax.googleapis.com/ajax/services/feed/load?callback=_handleJson&v=1.0&output=json&num=6&q='; var apiScript=document.createElement("script"); apiScript.setAttribute("id","_handleJson"); apiScript.setAttribute("type","text/javascript"); apiScript.setAttribute("charset","UTF-8"); apiScript.setAttribute("src",api_Url + encodeURIComponent(feed_Url)); document.getElementsByTagName("head")[0].appendChild(apiScript); } function _handleJson(json){ if ( json.responseStatus != 200 ) return; while(result.hasChildNodes()) result.removeChild(result.firstChild); for(var i=0;i<blogUrls.length;i++){ result_write(json.responseData.feed.entries); } document.getElementsByTagName("head")[0].removeChild(document.getElementById("_handleJson")); } function result_write(entries){ var today,pdate,dt,dd,a; today=new Date(); for(var i=0;i<entries.length;i++){ pdate=new Date(entries[i].publishedDate); if((today.getTime()-pdate.getTime())/24/3600/1000 > 3){ dt=document.createElement("dt"); dt.appendChild( document.createTextNode("New! ("+pdate.toLocaleString()+")") ); result.appendChild(dt); dd=document.createElement("dd"); a=document.createElement("a"); a.href=entries[i].link; a.appendChild( document.createTextNode(entries[i].title+"(by:"+entries[i].author+")") ); dd.appendChild(a); result.appendChild(dd); } } } // --> </script> </body>
- yyr446
- ベストアンサー率65% (870/1330)
少しjavascriptがかけるなら、「Google AJAX Feed API」 http://code.google.com/intl/ja/apis/ajaxfeeds/documentation/#SupportedFormats というサービスを使ってみたらいかがでしょう。 たいがいのRSSのフィード形式に対応していて、取得結果をJSON形式又はXMLで 返してくれます。(もちろんクロスドメインでも) ※Google嫌いの人のために Yahooにも同様のAPIサービスがあります。 「Yahooブログ検索」です。 http://developer.yahoo.co.jp/webapi/search/blogsearch/v1/blogsearch.html こっちも簡単です。 使う前にJSON、JSONP、XmlHttpRequestとかの基本用語のおさらいを しておきましょう。 サンプルご入用?
- think49
- ベストアンサー率59% (285/482)
とりあえず、この辺りを参照してみてください。 XMLHttpRequest Level 2 と wedata バックアップ - 0xFF http://d.hatena.ne.jp/os0x/20090610/1244618814 JavaScript/クロスドメイン制限の解除 - WebTips http://webtips.open-log.net/index.php?JavaScript/%E3%82%AF%E3%83%AD%E3%82%B9%E3%83%89%E3%83%A1%E3%82%A4%E3%83%B3%E5%88%B6%E9%99%90%E3%81%AE%E8%A7%A3%E9%99%A4 XMLHttpRequest Level 2 http://www.w3.org/TR/XMLHttpRequest2/
補足
サンプルまで教えていただきましてありがとうございます! 試してみたところ2009年12月2日の記事でもNEWが表示されてしまいます^^; 下記のようなhtmlの場合resultにRSSの取得結果を最新のものから5件づつ 取得し表示させかつ、3日以内の記事があればNEWを付加させたいです。 また、newmarkは複数のブログのうち1つでも3日以内の記事があれば表示させ 該当する記事がない場合には表示させないようにしたいと思っています。 <body onload="blogchks();"> <div id="newmark">3日以内の記事がありました</div> <dl id="result"></dl> </body>