pythonで作成したJSONファイルをhtmlとjavascriptで取り回したい
python3でJSONファイルを読み書きする方法は別記事にまとめた
■ 参考 : javascript】JSONファイル
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
-
-
-
-
-
-
基本的にjavascriptでJSONファイルを読み込む方法は3種類あるらしい
詳細は以下を参照
■ 参考 : JSONを読み込む方法(XMLHttpRequest()、$.getJSON()、$.ajax()、Fetch API)
www.i-ryo.com
今回は jQuey.jsの $.getJSON() を使ってみる
サンプルコードとして以下を参考にしながら書きました
■ 参考 : 【初心者用】jQueryを使ってjsonデータをhtmlに生成する(基本編)
plustrick.com
自分のコードは略
書こうとしたけど、ここでhtmlのタグを撃ちまくるのが苦痛で死にそうになった
とりあえず大事なことは
javascriptで
$.getJSON(json_log, function(data,status){ }
としてなんかの処理をする
json_logはファイル名、またはURL
dataにJSONファイルが展開される
for(var n in data) { index = data[n].index; }
と書くとjsonファイルの中のkeyについてループを回せる
↑の例だとdataの中にあるすべての要素のindexを見ている
これをすべての要素について繰り返して色々と処理していく
最後に、srcに詰め込んだコードをhtmlにappendして終了
何度もappendするよりも1度だけappendしたほうが実行時間が短いらしい
$('#recent_history').append(src);
ランキング参加中です
↓クリックしていただけると嬉しいです〜