Data URI scheme でjsonとか
Data URI scheme が意外と柔軟だった。
Chromium 43.0.2357.130 Ubuntu 14.04 (64-bit)
で試した。
chromeでもたぶん大丈夫。
jsonはこちらのを使わせてもらいました。
https://gist.github.com/kobaatsu/a7a179ad0490c43f4d6d#file-json
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function() {
var prefectures =
[
{
"label": "北海道",
"slug": "hokkaido"
},
{
"label": "青森県",
"slug": "aomori"
},
{
"label": "岩手県",
"slug": "iwate"
},
{
"label": "宮城県",
"slug": "miyagi"
},
{
"label": "秋田県",
"slug": "akita"
},
{
"label": "山形県",
"slug": "yamagata"
},
{
"label": "福島県",
"slug": "fukushima"
},
{
"label": "茨城県",
"slug": "ibaraki"
},
{
"label": "栃木県",
"slug": "tochigi"
},
{
"label": "群馬県",
"slug": "gunma"
},
{
"label": "埼玉県",
"slug": "saitama"
},
{
"label": "千葉県",
"slug": "chiba"
},
{
"label": "東京都",
"slug": "tokyo"
},
{
"label": "神奈川県",
"slug": "kanagawa"
},
{
"label": "新潟県",
"slug": "nigata"
},
{
"label": "富山県",
"slug": "toyama"
},
{
"label": "石川県",
"slug": "ishikawa"
},
{
"label": "福井県",
"slug": "fukui"
},
{
"label": "山梨県",
"slug": "yamanashi"
},
{
"label": "長野県",
"slug": "nagano"
},
{
"label": "岐阜県",
"slug": "gifu"
},
{
"label": "静岡県",
"slug": "shizuoka"
},
{
"label": "愛知県",
"slug": "aichi"
},
{
"label": "三重県",
"slug": "mie"
},
{
"label": "滋賀県",
"slug": "shiga"
},
{
"label": "京都府",
"slug": "kyoto"
},
{
"label": "大阪府",
"slug": "osaka"
},
{
"label": "兵庫県",
"slug": "hyogo"
},
{
"label": "奈良県",
"slug": "nara"
},
{
"label": "和歌山県",
"slug": "wakayama"
},
{
"label": "鳥取県",
"slug": "tottori"
},
{
"label": "島根県",
"slug": "shimane"
},
{
"label": "岡山県",
"slug": "okayama"
},
{
"label": "広島県",
"slug": "hiroshima"
},
{
"label": "山口県",
"slug": "yamaguchi"
},
{
"label": "徳島県",
"slug": "tokushima"
},
{
"label": "香川県",
"slug": "kagawa"
},
{
"label": "愛媛県",
"slug": "ehime"
},
{
"label": "高知県",
"slug": "kochi"
},
{
"label": "福岡県",
"slug": "fukuoka"
},
{
"label": "佐賀県",
"slug": "saga"
},
{
"label": "長崎県",
"slug": "nagasaki"
},
{
"label": "熊本県",
"slug": "kumamoto"
},
{
"label": "大分県",
"slug": "oita"
},
{
"label": "宮崎県",
"slug": "miyazaki"
},
{
"label": "鹿児島県",
"slug": "kagoshima"
},
{
"label": "沖縄県",
"slug": "okinawa"
}
];
(function() {
var hoge = document.getElementById("hoge");
hoge.onclick = function() {
window.open("data:application/json;charset=utf-8;," + JSON.stringify(prefectures));
return false;
};
})();
(function() {
var hoge2 = document.getElementById("hoge2");
var str = "<table border='1'>";
str += "<tr>";
str += "<th>label</th>";
str += "<th>slug</th>";
str += "</tr>";
for(var i in prefectures) {
var l = prefectures[i];
str += "<tr>";
str += "<td>";
str += l.label;
str += "</td>";
str += "<td>";
str += l.slug;
str += "</td>";
str += "</tr>";
}
str += "</table>";
hoge2.onclick = function() {
window.open("data:text/html;charset=utf-8;," + str);
return false;
};
})();
(function() {
var hoge3 = document.getElementById("hoge3");
var str = '<?xml version="1.0" encoding="UTF-8" ?>';
str += '<prefectures>';
for(var i in prefectures) {
var l = prefectures[i];
str += '<prefecture>';
str += '<label>';
str += l.label;
str += '</label>';
str += '<slug>';
str += l.slug;
str += '</slug>';
str += '</prefecture>';
}
str += "</prefectures>";
hoge3.onclick = function() {
window.open("data:text/xml;charset=utf-8;," + str);
return false;
};
})();
});
</script>
</head>
<body>
<ul>
<li>
<a id="hoge" href="#">json</a>
</li>
<li>
<a id="hoge2" href="#">html</a>
</li>
<li>
<a id="hoge3" href="#">xml</a>
</li>
</ul>
</body>
</html>