短いデータなどはHTML内に書いて置いて,検索をさせるようなことができます
まずは基本のスクリプトです.
<!doctype html> <html> <head> <meta charset="utf-8"> <title>JSON Test</title> </head> <body> <div id="zip_"></div> <script type="text/javascript"> var txt = { //javascriptの配列をここで作りtxtに入れる "area1":{ "地名1":"470-0000", "地名2":"470-0001", "地名3":"470-0002" }, "area2":{ "地名4":"470-0003", "地名5":"470-0004", "地名6":"470-0005" }, } var mytxt = "" + txt['area1']['地名3'];//txt配列のarea1の中の地名3の中身を取り出し,ダブルクォーテーションをつけて,mytxtに入れる // console.log(mytxt); //ここはデバッグ用の行 document.getElementById("zip_").innerHTML = mytxt;//このhtml内のzip_ というidのついたタグをさがし,そこにmytxtを流し込む </script> </body> </html>
これは郵便番号表としての使用を想定していますが,時刻表などにも使用できますね.
25行目で配列の中身を呼び出していますが,このサンプルは固定値です.
そこで,これを動的に呼び出す方法を検討しましょう.