javascript - チェックボックスの状態を HTML または Javascript に保存する

Question

私がプレイしているオンライン ゲームで、どのキャラクターがどのイベントを実行したかをマークできるようにするサイトを設計しようとしています (おそらく Chrome 拡張機能にする予定です)。チェックボックスの値を次の訪問まで (理想的にはキャラクター名も) 保存するオプションがあればいいのですが、私はコーディングが得意ではありません。また、この情報をコマンドで保存/クリア/リロードできれば、それ以外の方法ではできません。

問題のページ、私のコードが効率的または魅力的でない場合はご容赦ください。私は実際にはもう少しまとめて作業することを好みますが、あなたの利益のために整理しました.

私が一緒に仕事をしようとしていた提案がここにありました：

var i, checkboxes = document.querySelectorAll('input[type=checkbox]');

function save() {
    for (i = 0; i < checkboxes.length; i++) {
        localStorage.setItem(checkboxes[i].value, checkboxes[i].checked); 
    }
}

function load_() {
    for (i = 0; i < checkboxes.length; i++) {
        checkboxes[i].checked = localStorage.getItem(checkboxes[i].value) === 'true' ? true:false;
    }
} 

しかし、テストでは問題なく動作しますが、ドキュメントに配置すると動作しません (一番上に var i が表示され、reset 関数の上に配置した残りのコードが表示されます)。

ヘルプ？