コピペの力！: kfujitoの徒然（ｂｙ浮沈子）

[画像]
コピペの力！

今回は、入力関係の作成。

パラメーターをいちいち入れるのは面倒なので、ＨＴＭＬ５の機能であるローカルストレージというのをやってみた。

ＩＥとかでは動かないので、どうしようかと思っている（たぶん、コードの書き方が違うのかもしれない）。

やっぱ、ファイルのやり取りをしなければいけないんだろうか？。

そこにハマると、抜け出せない気がしたので、とりあえずコピペして動いたグーグルクローム（バージョン 45.0.2454.101 m）で試してみる。

「<html lang="ja">
<head>
<meta charset="utf-8">
<title>JavaScript</title>
</head>
<body onload="viewStorage();">

<script type="text/javascript">

/*
// （1）Web Storageの実装確認
if (typeof localStorage === 'undefined') {
window.alert("このブラウザはlocalStorage機能が実装されていません");
} else {
window.alert("このブラウザはlocalStorage機能を実装しています");
}
*/
var storage = window.localStorage;

// （2）localStorageへの格納
function setlocalStorage() {

var key = document.getElementById("textkey").value;
var value = document.getElementById("textdata").value;

// 値の入力チェック
if (key && value) {
window.localStorage.setItem(key, value);
}

key = "";
value = "";

viewStorage();
}

// （3）localStorageからのデータの取得と表示
function viewStorage() {

var list = document.getElementById("list")
while (list.firstChild) list.removeChild(list.firstChild);

// localStorageすべての情報の取得
for (var i=0; i < storage.length; i++) {
var _key = storage.key(i);

// localStorageのキーと値を表示
var tr = document.createElement("tr");
var td1 = document.createElement("td");
var td2 = document.createElement("td");
list.appendChild(tr);
tr.appendChild(td1);
tr.appendChild(td2);
td1.innerHTML = _key;
td2.innerHTML = storage.getItem(_key);
}
}

// （4）localStorageから削除
function removeStorage() {
var key = document.getElementById("textkey").value;
storage.removeItem(key);
key = "";
viewStorage();
}
/*
// （5）localStorageからすべて削除
function removeallStorage() {
storage.clear();
viewStorage();
}
*/

</script>

<section id="main">
保存するKey：<input id="textkey" type="text" />
保存する値：<input id="textdata" type="text" />
<button id="button" onclick="setlocalStorage()">保存</button>
<button id="button" onclick="removeStorage()">削除</button>

<table border="1">
<tr>
<th>キー</th><th>値</th>
</tr>
<tbody id="list">
</tbody>
</table>

<input type="button" value="値を変更したら、このボタンを押して再計算！" onclick="location.reload();" />

</section>

<script type="text/javascript">
function print(str){
document.write(str + "<br />");
}

var a=parseInt(storage.getItem("a"));
var d=parseInt(storage.getItem("d"));
var nhe=parseInt(storage.getItem("nhe"));
var nn2=parseInt(storage.getItem("nn2"));
var pa=parseInt(storage.getItem("pa"));
var pb=parseInt(storage.getItem("pb"));