ホームページ  >  記事  >  ウェブフロントエンド  >  Javascript JSON 操作エントリ example_json

Javascript JSON 操作エントリ example_json

WBOY
WBOYオリジナル
2016-05-16 18:29:121251ブラウズ

JSON のルールは単純です。オブジェクトは、「名前/値」ペアの順序付けされていないコレクションです。オブジェクトは「{」(左括弧) で始まり、「}」(右括弧) で終わります。各「名前」の後には「:」 (コロン) が続き、「名前と値」のペアは「,」 (カンマ) で区切られます。具体的な詳細については、http://www.json.org/json-zh.html
この記事に入門記事があります。JSON 学習完全マニュアルも参照してください。グラフィック付き
簡単な例:
js コード

コードをコピーコードは次のとおりです:

function showJSON() {
var user =
{
"username":"andy",
"age":20,
"情報": { "電話": "123456", "携帯電話": "98765"},
"住所":
[
{"都市":"北京","郵便番号" :"222333" },
{"city":"newyork","postcode":"555666"}
]
}
alert(user.username)
alert(user); .age);
alert(user.info.cellphone);
alert(user.address[0].postcode);


これは、ユーザー名、年齢、情報、住所などの属性を持つユーザー オブジェクトを表します。
JSON を使用してデータを単純に変更することもできます。上記の例を変更します
js コード


コードをコピー コード次のように:
function showJSON() {
var user =
{
"username":"andy",
"age":20,
" info": { "電話": "123456", "携帯電話": "98765"},
"住所":
[
{"都市":"北京","郵便番号":" 222333 "},
{"city":"newyork","postcode":"555666"}
]
}
alert(user.username);
alert(user.age) ) ;
alert(user.info.cellphone);
alert(user.address[0].postcode); = "Tom";
alert(user.username);
}


JSON は、http://www.json.org/json からダウンロードします。 .js を導入し、 object.toJSONString() を使用して JSON データに変換するだけです。
js コード



コードをコピー
コードは次のとおりです。 function showCar() { var carr = new Car("Dodge", "Coronet R/T", 1968, " yellow");
alert(carr.toJSONString());
function Car(メーカー、モデル、年、色) {
this.make =
this.model = モデル;
this.color = color; 🎜>

eval を使用して JSON 文字をオブジェクトに変換できます
js コード




コードをコピー


コードは次のとおりです。
または parseJSON() メソッド
js コードを使用します>



コードをコピー

コードは次のとおりです。


function myEval() {
var str = '{ "名前": "バイオレット", "職業": "キャラクター" }'; var obj = str.parseJSON(); alert(obj.toJSONString()); > 以下のプロトタイプを使用する JSON の ajax サンプルを作成します。 最初にサーブレット (私のサーブレットは servlet.ajax.JSONTest1.java) を書き、次の文を書きますjava code
response.getWriter().print("{ "name": "Violet", " 職業": "character" }");
ページに ajax リクエストを書き込みます
js コード




コードをコピーします


コードは次のとおりです。


function sendRequest() {
var url = "/MyWebApp/JSONTest1";
var mailAjax = new Ajax.Request( 関数 jsonResponse(originalRequest) {
alert(originalRequest.responseText);
var myobj =originalRequest.responseText.parseJSON();
alert(myobj.name)
}


JSON メソッドは、prototype-1.5.1.js で提供されます。 String.evalJSON() を使用すると、json.js を使用せずに上記のメソッドを変更できます。




コードをコピー


コード以下の通り:

function jsonResponse(originalRequest) {
alert(originalRequest.responseText);
var myobj =originalRequest.responseText.evalJSON(true);
}

JSON は Java jar パッケージも提供します http://www.json.org/java/index.html API も非常に簡単です。例を次に示します。
JavaScript を入力します。リクエストパラメータ
jsコード

コピーコード コードは次のとおりです。
function sendRequest () {
var carr = new Car("Dodge", "Coronet R/T", 1968, " yellow");
var pars = "car= carr.toJSONString(); url = " /MyWebApp/JSONTest1";
var mailAjax = new Ajax.Request(
url,
{
メソッド: 'get',
パラメータ: pars,
onComplete: jsonResponse
}
);
}


JSON リクエスト文字列を使用すると、JSONObject を生成して解析し、サーブレットを変更して JSON 処理を追加できます (次を使用する必要があります)。 json.jar)
java コード


private void doService(HttpServletRequest request, HttpServletResponse response ) throws IOException {
String s3 = request.getParameter("car");
try {
JSONObject jsonObj = new JSONObject(s3); out.println(jsonObj.getString("モデル"));
System.out.println(jsonObj.getInt("年"));
} catch (JSONException e) {
e.printStackTrace( );
}
response.getWriter().print("{ "名前": "バイオレット", "職業": "キャラクター" }");


JSONObject を使用して JSON 文字列を生成し、サーブレットを変更することもできます。
Java コード



コードをコピー
コードは次のとおりです private void doService( HttpServletRequest request, HttpServletResponse response) throws IOException { String s3 = request.getParameter("car")
try {
JSONObject jsonObj = new JSONObject(s3);
System.out.println( jsonObj.getString("model"));
System.out.println(jsonObj.getInt("year")); JSONException e) {
e.printStackTrace();
}
JSONObject resultJSON = new JSONObject();
try {
resultJSON.append("name", "Violet")
.append("職業", "開発者")
.append("年齢", new Integer(22));
System.out.println(resultJSON.toString());
(JSONException e) {
e.printStackTrace();
}
response.getWriter().print(resultJSON.toString())
}


js code



コードをコピー
コードは次のとおりです。 function jsonResponse(originalRequest) { alert(originalRequest.responseText); var myobj = originalRequest.responseText(true);
alert(myobj.age);
声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。