質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

解決済

1回答

2720閲覧

jsonファイルの配列のオブジェクトのオブジェクトの値の抽出方法

takapo114

総合スコア13

JSON

JSON(JavaScript Object Notation)は軽量なデータ記述言語の1つである。構文はJavaScriptをベースとしていますが、JavaScriptに限定されたものではなく、様々なソフトウェアやプログラミング言語間におけるデータの受け渡しが行えるように設計されています。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2018/09/19 06:41

---### 前提・実現したいこと
以下のjsonファイルから

json

1[ 2 { 3 "faceId": "4bd13b34-89c5-4f7b-b2ed-aa85b9596c17", 4 "smile": 1, 5 "faceRectangle": { 6 "top": 328, 7 "left": 158, 8 "width": 244, 9 "height": 244 10 }, 11 "faceAttributes": { 12 "smile": 1, 13 "gender": "male", 14 "age": 23 15 } 16 } 17]

smile,gender,ageをweb上で抽出したいのですが上手くいきません。
上の状態から出力したいのです。```

該当のソースコード

以下で抽出しています

js

1function getJson() { 2 //var xmlhttp = createXMLHttpRequest(); //旧バージョンのIEなどに対応する場合 3 var xmlhttp = new XMLHttpRequest(); 4 5 xmlhttp.onreadystatechange = function () { 6 if (xmlhttp.readyState == 4) { 7 if (xmlhttp.status == 200) { 8 var dat = JSON.parse(xmlhttp.responseText); 9 10 var elem = document.getElementById("output_s"); 11 elem.innerText = dat.smile; 12 var elem = document.getElementById("output_gender"); 13 elem.innerText = dat.gender; 14 var elem = document.getElementById("output_age"); 15 elem.innerText = dat.age; 16 17 } else { 18 } 19 } 20 } 21 xmlhttp.open("GET", "data.json"); 22 xmlhttp.send(); 23 } 24 function createXMLHttpRequest() { 25 if (window.XMLHttpRequest) { return new XMLHttpRequest() } 26 if (window.ActiveXObject) { 27 try { return new ActiveXObject("Msxml2.XMLHTTP.6.0") } catch (e) { } 28 try { return new ActiveXObject("Msxml2.XMLHTTP.3.0") } catch (e) { } 29 try { return new ActiveXObject("Microsoft.XMLHTTP") } catch (e) { } 30 } 31 return false; 32 } 33 34 </script> 35 36</head> 37<body> 38 <input id="Button_Get" type="button" value="JSON読み込み" onclick="getJson();" /> 39 <hr /> 40 <div>受信情報</div> 41 Smile:<span id="output_s"></span><br /> 42 Gender:<span id="output_gender"></span><br /> 43 age:<span id="output_age"></span><br /> 44 45 46</body> 47

試したこと

ネットで検索、思い当たる方法を試してみる等

上記ソースが置いてあるサイト

https://www.ipentec.com/document/javascript-json-parsing

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

配列の、0キーの要素(オブジェクト)の、faceAttributesプロパティの、genderプロパティが欲しいんですよね?

だったらdat[0].faceAttributes.genderもしくは、
dat[0]['faceAttributes']['gender']でアクセスできそうですね。
試してみてください。

投稿2018/09/19 06:48

miyabi-sun

総合スコア21158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

takapo114

2018/09/19 06:58

2時間悩んでましたが、1発でできました。 ありがとうございます!!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問