localStrageの より正確な対応チェック ITかあさん

ITかあさん

localStrageの より正確な対応チェック

localStrageの正確な対応チェック

localStraeの対応はIEでは、8からとなっています。IE7以前ではlocaStrageは非対応ということになり、対応か、非対応かで処理を分ける必要があります。

さらに、バージョンがIE8でもデフォルトでインターネットオプションに『DOMストレージ』が有効になっていないと動作します。

つまりlocalStrageの対応チェックは

・DOMストレージが有効になっているか
・そもそもブラウザがlocalStrageか

この2つをチェックしてあげる必要があります。

そんなわけでかあさんは以下のスクリプトを実行しました。

localStrage対応チェックのサンプルコード

 //Javascriptエラーを非表示
function TigilError() {
  return true;
  }
  window.onerror = TigilError;
  $(function(){
  //localStrageの対応チェック 
  if(('localStorage' in window) && window['localStorage'] !== null){
  //localStrage対応なら、テストでストレージをセット
  localStorage.setItem('test', 'test'); 
  //テストでセットしたlocalStorageを変数として定義
  var test = localStorage.getItem('test'); 
  }
//Javascript版issetはたったこれだけ
//対応ならid→hogeに対してテキスと追加
if(test){
  $("#hoge").append('対応');
  }else{
  $("#hoge").append('非対応');
  }

解説

一説にはif(localStorage){}だけでもよいのですが、IE7ではlocalStorageと書いた時点で未対応ですからエラーがが返ってしまいますね。

そこで完全未対応ブラウザのためにあらかじめエラーを非表示にし、
対応ならばlocalStrageにtestをセットし、後は変数化したtestがセットされているか、されていないかで判定を行います。

IE8、9、では対応と表示され、IE7 では非対応となりました。

なお、インターネットオプションのDOMストレージのチェックが入っていない場合は『非対応』の表示が確認でき、より正確にlocalStorageの判定が取れました。

初夏のJavaScript祭 in サーキュレーションビル ForPro