localStrage ITかあさん

ITかあさん

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

localStrageの正確な対応チェック

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

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

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

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

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

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

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

  1.  //Javascriptエラーを非表示  
  2. function TigilError() {  
  3.   return true;  
  4.   }  
  5.   window.onerror = TigilError;  
  6.   $(function(){  
  7.   //localStrageの対応チェック   
  8.   if(('localStorage' in window) && window['localStorage'] !== null){  
  9.   //localStrage対応なら、テストでストレージをセット  
  10.   localStorage.setItem('test''test');   
  11.   //テストでセットしたlocalStorageを変数として定義  
  12.   var test = localStorage.getItem('test');   
  13.   }  
  14. //Javascript版issetはたったこれだけ  
  15. //対応ならid→hogeに対してテキスと追加  
  16. if(test){  
  17.   $("#hoge").append('対応');  
  18.   }else{  
  19.   $("#hoge").append('非対応');  
  20.   }  

解説

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

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

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

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