jQuery経由で最後のツイートを取得する方法

getdocs

4年前

リンク:www.twitter.com[Twitter]は、ツイートに対処するための多くのAPIを提供しています。

この例では、jQueryを使用してユーザーの最後のつぶやきを取得する方法を学習します。

http://search.twitter.com/search.json?q=from:username&rpp=1

たとえば、Twitterのユーザー「techfou」から最後のつぶやきを取得します。

http://search.twitter.com/search.json?q=from:techfou&rpp=1

1. jQuery Ajax

私たちはJqueryの `.ajax（）`関数を使って、ユーザーの最後のつぶやきを取得して表示します。

$('#last-tweet').click(function(){

   $("#tweet__result").text("Loading......");

   var username = $('#username').val();

   $.ajax({
     type: "GET",
     dataType: "json",
     url: "http://search.twitter.com/search.json?q=from:"+username+"&rpp=1&callback=?",
     success: function(data){
        $("#tweet__result").text(data.results[0].text);
     }
   });

});

2.完全なHTMLの例

この例では、ユーザ名をボックスに書き込んでボタンをクリックすると、ユーザの最後のつぶやきを取得します。

<html>
<head>
<title>How to Get Last Tweet with Jquery Example</title>
<script
    src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"
    type="text/javascript"></script>
</head>

<body>
    <h1>Get Last Tweet with jQuery</h1>

    username :
    <input type='text' id='username' size='50' value='mkyong'/>
    <br/>
    <br/>
    <h2>
        Last Tweet : <span id="tweet__result"></span>
    </h2>

    <button id="last-tweet">Get Last Tweet (.Ajax)</button>
    <script type="text/javascript">
    $('#last-tweet').click(
      function() {

        $("#tweet__result").text("Loading......");

        var username = $('#username').val();

        $.ajax({
            type : "GET",
            dataType : "json",
            url : "http://search.twitter.com/search.json?q=from:"
                + username + "&rpp=1&callback=?",
            success : function(data) {
                $("#tweet__result").text(data.results[0].text);
            }
      });
    });
    </script>

</body>
</html>