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

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

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

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

Q&A

解決済

1回答

277閲覧

連想配列をfor文で表示させたい

nikuniku12

総合スコア14

JavaScript

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

0グッド

0クリップ

投稿2019/11/13 09:07

編集2019/11/13 11:32

下記のテキストファイルからfor文を使い
name:名前 val:ハンバーグ
name:分類 val:洋食
name:主成分 val:タンパク質

といったような感じで表示させていきたいのですが、下記の方法ではこの通りに表示されませんでした。どのようにやればできますでしょうか?

txt

1名前=ハンバーグ, 分類=洋食, 主成分=タンパク質 2名前=寿司, 分類=和食, 主成分=炭水化物 3名前=牛乳, 分類=飲み物, 主成分=カルシウム

javascript

1 $(function(){ 2 $("#button").click(function(event){ 3 $.ajax({ 4 type: "GET", 5 url: "text.php", 6    data: {val:null}, 7 dataType : "text" 8 }).done(function(data){ 9  var test = JSON.parse(data); 10 window.addEventListener('DOMContentLoaded', ()=>{ 11 var data=test.split(/\n/).map(x=>{ 12 return x.split(", ").map(x=>{ 13 var y=x.split('='); 14 return {name:y[0],val:y[1]}; 15 }); 16 }).reduce((x,y)=>x.concat(y)); 17 console.log(data); 18 }); 19 }).fail(function(XMLHttpRequest, textStatus, errorThrown){ 20 alert(errorThrown); 21 }); 22 }); 23 });

php

1$text=file("name.txt"); 2$text_array = array(); 3foreach($text as $row){ 4$params = explode(",",$row); 5$text_array[$params[0]] = $params[1]; 6} 7$json = json_encode($text_array); 8echo $json;

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

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

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

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

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

yambejp

2019/11/13 09:08

textに入っているのが同じデータばかりだと応用がききません
azuapricot

2019/11/13 09:33

test[key] の間違いじゃなくて・・・?
guest

回答1

0

ベストアンサー

javascript

1<script> 2var str=`名前=ハンバーグ, 分類=洋食, 主成分=タンパク質 3名前=寿司, 分類=和食, 主成分=炭水化物 4名前=牛乳, 分類=飲み物, 主成分=カルシウム`; 5window.addEventListener('DOMContentLoaded', ()=>{ 6 str.split(/\n/).forEach(x=>{ 7 x.split(", ").forEach(x=>{ 8 var y=x.split('='); 9 var test=document.querySelector('.test'); 10 test.appendChild(document.createTextNode("name:"+y[0]+" val:"+y[1])); 11 test.appendChild(document.createElement("br")); 12 }); 13 }); 14}); 15</script> 16<div class="test"></div>

ちなみにこうすると

javascript

1var str=`名前=ハンバーグ, 分類=洋食, 主成分=タンパク質 2名前=寿司, 分類=和食, 主成分=炭水化物 3名前=牛乳, 分類=飲み物, 主成分=カルシウム`; 4window.addEventListener('DOMContentLoaded', ()=>{ 5 var data=str.split(/\n/).map(x=>{ 6 return x.split(", ").map(x=>{ 7 var y=x.split('='); 8 return {name:y[0],val:y[1]}; 9 }); 10 }).reduce((x,y)=>x.concat(y)); 11 console.log(data); 12});

こんなデータが返ります

{ name: "名前", val: "ハンバーグ" } { name: "分類", val: "洋食" } { name: "主成分", val: "タンパク質" } { name: "名前", val: "寿司" } { name: "分類", val: "和食" } { name: "主成分", val: "炭水化物" } { name: "名前", val: "牛乳" } { name: "分類", val: "飲み物" } { name: "主成分", val: "カルシウム" }

textをfetch

仮にtextデータをfetchで呼んで処理する場合

  • test.txt

text

1名前=ハンバーグ, 分類=洋食, 主成分=タンパク質 2名前=寿司, 分類=和食, 主成分=炭水化物 3名前=牛乳, 分類=飲み物, 主成分=カルシウム

javascript

1fetch('test.txt').then(res=>res.text()).then(str=>{ 2 var data=str.split(/\n/).map(x=>{ 3 return x.split(", ").map(x=>{ 4 var y=x.split('='); 5 return {name:y[0],val:y[1]}; 6 }); 7 }).reduce((x,y)=>x.concat(y)); 8 console.log(data); 9});

投稿2019/11/13 09:42

編集2019/11/13 11:30
yambejp

総合スコア114572

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

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

nikuniku12

2019/11/13 10:58

phpでテキストファイルを取得しエンコードしたデータをjsでparseしたデータに、回答と同じようにやってみているのですがエラーも何も表示されません。。何故だかわからないでしょうか
yambejp

2019/11/13 11:07

> phpでテキストファイルを取得しエンコードしたデータ を、どうやっているか提示してください ajax(fetch)でjson渡しとかしてますか?
nikuniku12

2019/11/13 11:33

編集いたしました
yambejp

2019/11/13 11:42

PHPの処理が基本ができてないのでこれはダメ こんなデータを返してきています { "名前=ハンバーグ": " 分類=洋食", "名前=寿司": " 分類=和食", "名前=牛乳": " 分類=飲み物" } まずはPHPの方をなんとかしてください
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.50%

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

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

質問する

関連した質問