ホームページ > ウェブフロントエンド > フロントエンドQ&A > JQuery 3.2.1 の get メソッドの使用方法の詳細な説明

JQuery 3.2.1 の get メソッドの使用方法の詳細な説明

PHPz
リリース: 2023-04-05 14:26:23
オリジナル
670 人が閲覧しました

JQuery は、Web 開発で DOM の操作、非同期リクエストの実行、イベントの処理などによく使用される優れた JavaScript ライブラリです。最も一般的に使用されるのは get メソッドです。この記事では、JQuery 3.2.1 での get メソッドの使用法について詳しく説明します。

1. get メソッド

get メソッドは、JQuery で最もよく使用されるメソッドの 1 つで、指定された URL コンテンツのネットワーク リクエストを取得できます。

このメソッドには、次のような多くの形式があります。 jQuery.get( url [, data ] [, success ] [, dataType ] ) および jQuery.getJSON( url [, data ] [、 成功 ] )###。このうち、get() メソッドは jqXHR オブジェクトを返し、getJSON() メソッドは JSON データを返します。

2. 基本構文

get メソッドの基本構文は次のとおりです:

$.get(url, [data], [callback], [type]);
ログイン後にコピー
このうち、url はリクエストのアドレス、data は送信するデータを表します。リクエストに応じてサーバーにアクセスします。 callback はオプションのパラメータであり、多くの場合匿名関数であり、サーバーから返されたデータを処理するために使用されます。 type はサーバーから返されるデータ型を示し、デフォルトは xml です。

3. 例

以下は、テキスト ファイルを取得するための get メソッドの簡単な例です:

$("#button").click(function(){
    $.get("test.txt", function(data, status){
        alert("Data: " + data + "\nStatus: " + status);
    });
});
ログイン後にコピー
上の例では、ユーザーがボタンをクリックすると、この関数を実行し、get メソッドを呼び出して test.txt ファイルの内容を要求し、その内容をポップアップ ウィンドウに表示します。

次は、JSON データを取得するために使用される get メソッドの別の例です:

$.get("data.json", function(data, status){
    alert("Data: " + data + "\nStatus: " + status);
}, "json");
ログイン後にコピー
上の例では、get メソッドを使用して data.json ファイルのコンテンツをリクエストし、データを入力するウィンドウが表示されます。データ型を JSON として指定したことに注意してください。

4. getJSON メソッド

getJSON メソッドは get メソッドと似ており、サーバー上の JSON データを取得できます。

getJSON メソッドの基本的な構文は次のとおりです。

$.getJSON(url, [data], [callback]);
ログイン後にコピー
このうち、url、data、callback パラメーターは get メソッドと同じ意味を持ちます。

以下は簡単な例です:

$.getJSON("data.json", function(data){
    $.each(data, function(index, obj){
        alert(obj.name);
    });
});
ログイン後にコピー
上の例では、getJSON メソッドを呼び出して data.json ファイルのコンテンツをリクエストし、返された JSON データを走査して、 name 値がポップアップ ウィンドウに表示されます。

5. 概要

上記は、JQuery 3.2.1 での get メソッドと getJSON メソッドの使用の簡単な例です。これらの例を通して、これら 2 つのメソッドの基本的な使用法を確認できます。この知識は、JavaScript をさらに学習したい Web 開発者にとって必要であると思います。

以上がJQuery 3.2.1 の get メソッドの使用方法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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