• 締切済み

JavaScriptに詳しい方へ。

はじめまして。twitterのつぶやきをブログへ貼り付ける方法をお聞きしたく、質問させていただきます。 Twitterの正規のブログパーツではたまに表示されないことがあるので、googleの提供する、Ajax feed というRSSを試して、成功したのですが文章が、 「kobayashitakuya: おはよう。」 「kobayashitakuya: おやすみ。」 のように、ひとつひとつのつぶやきに「@kobayashitakuya」というTwitterIDまで表示されてしまいます。 これを非表示にする方法をご教授してくださった方がいらしたら、とても助かります。 どなたか時間があればご教授してください。 ちなみにソースは以下のとおりです。 google.load("feeds", "1"); google.setOnLoadCallback(function() { var feed = new google.feeds.Feed("http://twitter.com/statuses/user_timeline/162644645.rss"); feed.setNumEntries(15); //表示つぶやき数 feed.load(function(result) { if (!result.error) { var html = ""; html += "<div class='newslist'>"; html += "<dl>"; for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var date = (dd.getMonth() + 1) + "月" + dd.getDate() + "日&nbsp;" + dd.getHours() + ":" + dd.getMinutes(); var content = entry.content; var contentSnippet = entry.contentSnippet; html += "<dt>" + date + "</dt>"; html += "<dd>"; html += "<a class='title' target='_blank' href='" + entry.contentSnippet + "'>" + result.feed.entries[i].title + "</a>"; html += "</dd>"; } html += "<dl>"; html += "</div>"; $("#kobayashi").html(html); } }); }); これで、 <div id="kobayashi"></div> と入力すると、つぶやきが表示されます。 「おはよう。」とつぶやくと、 「kobayashitakuya: おはよう」 と表示されます。 参考までに宜しくお願いします。

みんなの回答

  • 4017B
  • ベストアンサー率73% (1303/1774)
回答No.1

え~っと、とりあえず… html += "<a class='title' target='_blank' href='" + entry.contentSnippet + "'>" + result.feed.entries[i].title + "</a>"; ~の部分を、 /* 置換処理:begin */ var my_tweet = entry.title; my_tweet = my_tweet.replace( /^[0-9a-zA-Z]+:\s*/, "" ); entry.title = my_tweet; /* 置換処理:end */ html += "<a class='title' target='_blank' href='" + entry.contentSnippet + "'>" + entry.title + "</a>"; ~の様に書き換えればOKなはず??これで恐らくTLの冒頭部分のアカウント名のみ削除出来ます。 P.S. 基本的にTwitterは時間帯によってはかなり重くなりますし、時間単位での同一IP同一アカウントからのアクセス回数にも制限を設けてます(確か300回/1時間?)。なのでガジェットなどでTwitterのTLが読み込めないのはよく起きますので、必ずしも使っているBlogパーツが悪いという訳でも無いと思います。 サンプルのRSSが某AKB48だったのでビックリしました!最初、このおっさん何、気持ち悪い顔文字とか使ってるんだろ…とか思ってしまいました(笑)。 TwitterのTL取得なら、RSSよりもJSONで取ってきた方がデータ加工が非常に楽なので、そっちの方をお奨めします(どの道、JavaScriptを使う事には変わりないので)。

関連するQ&A

  • Scriptを読み込み中の表示について

    HTML <script language="JavaScript" type="text/javascript" src="AAA.js"></script> 外部JS <!-- google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("RSSURL"); feed.setNumEntries(5); feed.load(function(result) { if (!result.error) { var container = document.getElementById("mini_feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("div"); var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var yearNum = dd.getYear(); if (yearNum < 2000) yearNum += 1900; var date = yearNum + "年"+(dd.getMonth()+1)+"月"+dd.getDate()+"日"; container.innerHTML += "<div>【"+"<b>" + date+"</b>" +"】<br /><a href='" + entry.link + "'>" + entry.title + "</a></div>"; } } }); } google.setOnLoadCallback(initialize); //--> を設置し、RSSをスクリプトで表示しています。 2秒くらい読込みが遅いので、その部分が、一時空白状態のままになります。 そこで、読み込み中に読込みしていますというぐるぐる回る画像を表示したいのですが、どのように記述すれば宜しいのでしょうか?

  • javascriptでわからない所があります。

    javascriptでわからない所があります。アドバイスお願いします。 ブログでajax feed apiを使いRSSを表示しようと思い下記のサイトのコードを貼ってみました。 サイト⇒http://www.zoezoe.net/2008/06/javascriptrssgoogle-ajax-feed.php 以下サイトのコード --------------------- <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAA7_2e7OzfQnVgCZgpBhg3_RRuFDZ..."></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://www.zoezoe.net/atom.xml"); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var yearNum = dd.getYear(); if (yearNum < 2000) yearNum += 1900; var date = '<li>' + yearNum + "年"+(dd.getMonth()+1)+"月"+dd.getDate()+"日 "; container.innerHTML += " " + date +"<a href='" + entry.link + "' title='" + entry.title + "'>" + entry.title + "</a></li>"; } } }); } google.setOnLoadCallback(initialize); </script> </head> <body> <ul> <div id="feed"></div> </ul> </body> --------------------- これをカスタマイズしたいのですが、以下のことができません。アドバイスお願いします。 ○表示したRSSの間に区切り線を入れたい ○日付の次を改行して    日付    タイトル のように表示したい。 ○別タブで開きたい。 一つでも分かりましたらアドバイスお願いします。 var date = '<li>' + yearNum + "年"+(dd.getMonth()+1)+"月"+dd.getDate()+"日 "; container.innerHTML += " " + date +"<a href='" + entry.link + "' title='" + entry.title + "'>" + entry.title + "</a></li>"; ↑の所をいじっても出来ませんでした。

  • Google AJAX Feed APIキー

    http://okwave.jp/qa/q7289256.html ↑こちらの記事を参考にしてサイトのTOPページにWPのタイトル表示を試みました。 表示はされるものの、そのタイトルを更にリンク(各記事にとぶ)にしたいのですが、 以下のソースのどこをいじればリンクになるのか教えて下さい。 ------------------------------------------------------- ■タイトル表示させたいページの<head>内に以下入れる。 <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("★RSS★"); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("div"); div.appendChild(document.createTextNode(entry.title)); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); </script> ■HTMLのタイトル表示させたい部分に以下入れる。 <div id="feed"></div> ------------------------------------------------------------------------------- よろしくお願い致します。

  • Google AJAX Feed APIで、ホームページにアメブロRS

    Google AJAX Feed APIで、ホームページにアメブロRSSを表示する際、「PR」広告を排除したいです。 現在のソースは以下の通りです。 ------------------------ <script type="text/javascript" src="http://www.google.com/jsapi?key=・・・・・・"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://feedblog.ameba.jp/rss・・・・・"); feed.setNumEntries(5); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var yearNum = dd.getYear(); if (yearNum < 2000) yearNum += 1900; var m = dd.getMonth() + 1; if (m < 10) {m = "0" + m;} var d = dd.getDate(); if (d < 10) {d = "0" + d;} var date = yearNum + "." + m + "." + d + " "; container.innerHTML += "<p>" + date +" <a href='" + entry.link + "' target='_blank'>" + entry.title + "</a></p>"; } } }); } google.setOnLoadCallback(initialize); </script> (ボディー内) <p><div id="feed"></div></p> ------------------------ どこをどのようにすればいいのでしょうか? どうぞ宜しくお願いいたします。

  • jacascriptでサイトにRSSフィードを表示した際の文字制限につ

    jacascriptでサイトにRSSフィードを表示した際の文字制限について 以下jacascriptでサイトにRSSフィードを表示してます。 google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://xxxxxxxxxxxxx.rdf"); feed.setNumEntries(5); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var dd = new Date(entry.publishedDate); // now var yearNum = dd.getYear(); if (yearNum < 2000) yearNum += 1900; var m = dd.getMonth() + 1; if (m < 10) {m = "0" + m;} var d = dd.getDate(); if (d < 10) {d = "0" + d;} var date = yearNum + "-" + m + "-" + d + " "; container.innerHTML += "<p>" + "<span>" + date + "</span>"+ "&nbsp;<a href='" + entry.link + "' target='_blank'>" + entry.title.substr(0,15) + "</a></p>"; } } }); } google.setOnLoadCallback(initialize); 表示する文字数をsubstr(0,15)で制限しているのですが、15文字以上はタイトルの右に「…」を付加させたいのですが、どのようにすればよいのでしょうか?

  • scriptリンクの別画面表示

    はじめまして。 ホームページのトップにブログの件名をニュースとして一覧表示したくて Google AJAX Feed API を利用しました。 表示自体はうまくいったのですが、 この記事へのリンクを別ウィンドウで開くようにするにはどうすればいいのでしょうか? 当方、JavaScriptは全く分からずで困っております・・・ おわかりの方、いらっしゃいましたらよろしくお願いいたします。 【html header 部分】 <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://blog.XXXXX.XXX"); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var li = document.createElement("li"); var a = document.createElement("a"); a.href = entry.link ;       var date = new Date(entry.publishedDate); var titlelink = entry.title; a.appendChild(document.createTextNode( "・" + date.toDateString() + " " +titlelink)); li.appendChild(a); container.appendChild(li); } } }); } google.setOnLoadCallback(initialize); </script> 【html body 部分】 <div id="feed"></div> 以上、どうぞよろしくお願いいたします。

  • RSSで取得したURLに文字列を追加と配置?

    現在googleのAPIを使いRSSからURLと画像を取得しています。 それで質問なんですが、その取得した(それぞれの)URL末尾に指定した同一の英数字を付加と、 表示する画像のレイアウト(現在は縦一列表示)を4×4とかにしたいとですがうまく出来ません>< 複数のURLだと、どの段階で??どう振り当てて組み込んだら良いのか?? レイアウトもCSSで試みましたが一括で処理されるので途中で区切っての配置が出来ず;; 複数の画像だとどうやって振り当てていくのかが判りません>< 初心者で申し訳ありませんがよろしく願いします。<m(__)m> <script type="text/javascript" src="googleのapiキー"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("RSSのURL");   feed.setNumEntries(16); feed.load(function(result) { if (!result.error)   { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) {var entry = result.feed.entries[i] ; var gazo = entry.content.match("<img.*jpg.*?>") if(gazo != null){container.innerHTML += "<p><a href='" + entry.link + "'>" + gazo +"</a></p>" } var div = document.createElement("div"); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); </script> <body onload="OnLoad()"> <div id="feed" ></div>

  • Google AJAX Feed APIについて

    ブログのRSSを使って自動的にホームページに新着ブログ記事の日付とタイトルを表示されるようにしたいと思い、Google AJAX Feed APIを使用しました。 下記のソースだとこのように表示されます。 ・タイトル(2009年6月22日) ・タイトル(2009年6月20日) 表示方法をもう少し変えたいんですが、文字サイズと行間の変更はどのようにすれば可能か、ご存知の方は教えて下さい。 1.文字サイズをもう少し小さく(10pxに)したい 2.行間がくっ付いているのでもう少し広くしたい <script type="text/javascript" src="http://www.google.com/jsapi?key=APIキー"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("フィードのアドレス"); feed.setNumEntries(10); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("li"); var a = document.createElement("a"); a.href = entry.link; a.target = "_top" ; var date = new Date(entry.publishedDate); a.appendChild(document.createTextNode(entry.title + " (" + date.toLocaleDateString() + ")" )); div.appendChild(a); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); </script> <div id="feed"></div>

  • Google AJAX Feed API

    Google AJAX Feed APIでRSSを読み込んでタイトルなどの文字のみの表示をすることはできたのですが、(下の記述でやっています。) 画像が投稿されているブログ記事の画像を読み込み、表示させることはできるのでしょうか? その場合の方法はどのように、すればできるのでしょうか? お手数をおかけしますが、よろしくお願い致します。 <script type="text/javascript" src="http://www.google.com/jsapi?key="></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://");  <!--表示したいエントリー数--> feed.setNumEntries(10); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("li"); var a = document.createElement("a");a.href = entry.link;  <!--別窓で表示しない場合は削除してください--> a.target = "_blank" ; a.appendChild(document.createTextNode(entry.title)); div.appendChild(a); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); </script>

  • JavaScriptで表示文字数を制御したい

    Google Feed APIを使い、JavaScriptで自分のホームページにRSSのニュースを表示しています。 文字の大きさ と 行間 は、以下のような <style type="text/css"> #feed { font-size:16px; } #feed li { height: 4em; } </style> のcssを書くことによって調整できましたが、現在の状態だと全部のニュースを表示してしまうので 表示する文字数を「先頭から40文字」までにしたいのですが、 そのやり方が分かりません。 具体的に、どうすればよいのか、ご教示いただければと思っています。 大変困っているので、何卒よろしくお願い致します。 以下、参考までにjavascriptも載せておきます。 <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { //RSSフィードの取得 var feed = new google.feeds.Feed("RSSフィードのアドレス"); //表示したいエントリー数 feed.setNumEntries(4); //実際に読む込む feed.load(function(result) { //読み込めたか判別 if (!result.error) { //表示部分を選択 var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var div = document.createElement("li"); var a = document.createElement("a");a.href = entry.link; a.target = "_blank" ; //日付を取得 var date = new Date(entry.publishedDate); var yearNum = date.getYear(); if (yearNum < 2000) yearNum += 1900; a.appendChild(document.createTextNode(entry.title)); //タイトルと日付の行を変える a.appendChild( document.createElement( "br" ) ); //a.appendChild(document.createTextNode(" (" + date.toLocaleDateString() + ")" )); //↑chromeで年月日が表示されない a.appendChild(document.createTextNode("(" + yearNum + "年" + (date.getMonth()+1)+"月"+date.getDate()+"日"+")" )); div.appendChild(a); container.appendChild(div); } } }); } google.setOnLoadCallback(initialize); </script>

専門家に質問してみよう