ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery.getJSON()関数の使い方を詳しく解説

jQuery.getJSON()関数の使い方を詳しく解説

巴扎黑
リリース: 2017-07-03 09:30:57
オリジナル
1258 人が閲覧しました

jQuery.getJSON() 関数は、HTTP GET 形式の AJAX リクエストを通じてリモートの JSON エンコードされたデータを取得するために使用されます。

JSON はデータ形式です。JS は、jQuery.getJSON() を通じてサーバーから取得した JSON データを、まず対応する JS オブジェクトに変換しようとします。

リクエストされたURLに「callback=?」などが含まれている場合、jQueryは自動的にJSONPとして扱い、対応するコールバック関数を実行してJSONデータを取得します。

重要な注意事項: サーバーから返される JSON データは、厳密な JSON 構文に準拠する必要があります。たとえば、すべての属性名は二重引用符で囲む必要があり、すべての string 値も二重引用符で囲む必要があります (一重引用符)。

この関数はデータを非同期的にロードすることに注意してください。

この関数はグローバル jQuery オブジェクトに属します。

Syntax

jQuery 1.0 では、この静的関数が追加されています。

jQuery.getJSON( url [, data ] [, success ] )

Parameters

パラメータの説明

url String型でリクエストのターゲットURLを指定します。

data Optional/String/Object classtypeは、リクエストによって渡されたデータを送信します。

success Function タイプのリクエストが成功したときに実行されるオプション/コールバック関数。これには 3 つのパラメータがあります。1 つはリクエストによって返されたデータ、もう 1 つはリクエストのステータス テキスト (「success」、「notmodified」など)、3 つ目は現在の jqXHR オブジェクト (jQuery 1.4 以前のバージョンではこのパラメータ)はネイティブの XMLHttpRequest オブジェクトです)。

success パラメータで指定されたコールバック関数は、リクエストが成功した場合にのみ実行され、リクエストが失敗した場合 (ページが見つからない、サーバーエラーなど)、処理は実行されません。

戻り値

jQuery.getJSON()関数の戻り値は jqXHR 型で、リクエストを送信した jqXHR オブジェクトを返します (jQuery 1.4 以前のバージョンはネイティブ XMLHttpRequest オブジェクトを返します)。

例と説明

jQuery.getJSON() は、jQuery.ajax() 関数の次の略語です:

jQuery.getJSON(url, data, success);
// 等价于
$.ajax({
 url: url,
 type: "GET",
 data: data,
 success: success,
 dataType: "json"
});
ログイン後にコピー

次の HTML サンプル コードを参照してください:

<div id="content1">CodePlayer</div>
<div id="content2">专注于编程开发技术分享</div>
<div id="content3">http://www.365mini.com</div>
ログイン後にコピー

以下は、jQuery.getJSON() に関連しています。 jQuery.getJSON() 関数の具体的な使用法を示す関数 jQuery サンプル コード:

//获取index.php?type=json的JSON数据,但不作任何处理
$.getJSON( "index.php?type=json" );
// 等价于 index.php?id=5&orderId=5&money=100
$.getJSON( "index.php?id=5", "orderId=5&money=100" );
// 等价于 http://localhost/index.php?id=5&orderId=5&money=100
$.getJSON( "http://localhost/index.php?id=5", {orderId: 5, money: 100} );
/* ***** 一般不会使用上述不对获取的JSON数据作任何处理的用法***** */
// 获取index.php?type=json的JSON数据,获取成功时弹出对话框
$.getJSON( "index.php?type=json", function(data, textStatus, jqXHR){
    // data 是该请求返回的数据(可能经过处理)
    // textStatus 可能是"success"、 "notmodified"等
    // jqXHR 是经过jQuery封装的XMLHttpRequest对象(保留其本身的所有属性和方法)
    // 如果服务器返回的JSON格式的数据是 {"id": 5, "name": "CodePlayer"}
    // JSON格式的数据的属性名称必须加双引号,字符串值必须加双引号。
    // jQuery已经将其转换成对应的JS对象
    alert( data.id ); // 5
    alert( data.name ); // CodePlayer
} );
// 获取"/action.php?m=list&page=2&size=10"的JSON数据,获取成功时弹出对话框
$.getJSON( "/action.php?m=list", { page: 2, size: 10  }, function(data, textStatus, jqXHR){
    // 如果服务器返回的JSON格式的数据是 [ {"id":11, "title":"文章11"}, {"id":12, "title":"文章12"}, {"id":13, "title":"文章13"} ]
    // jQuery将获取的JSON格式数据转换为JS数组
    for(var i in data){
        var obj = data[i];
        alert( obj.title );
    }
} );
ログイン後にコピー

以上がjQuery.getJSON()関数の使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート