menu
menu

キーワード検索

 

前月(7月)の人気記事トップ10

  1. ( 1-) CSSだけでドロップダウンメニュー
  2. ( 2-) CSSだけでサイズ可変・スマホ対応のアコーディオン
  3. ( 3-) スマホサイトの作成・基本編
  4. ( 4-) CSSだけでブロック要素の表示非表示(トグルボタン)
  5. ( 7↑) jQueryで日時を表示【実践でjQuery入門】
  6. ( 5↓) 表示しているブラウザの高さを取得してCSSのheightに指定
  7. ( 9↑) スマホサイト向け横にスクロールするナビゲーション
  8. ( 8-) HTML5・ページ作成の基本
  9. ( -↑) Windows 10にMySQLをインストール
  10. ( -↑) 変数を宣言する【jQuery入門】

ローカルストレージ

  • Labs

JavaScript

こんにちは(・∀・)

久しぶりの更新になりました。今回はJavaScriptのローカルストレージです。

クッキーに代わり最近主流となりつつあるローカルストレージですが、未だIEでは未対応です。今回たまたまローカルストレージとクッキーを使用する機会がありましたのでその覚書をかねて投稿します。

まあ、ローカルストレージとクッキーを同時に使用することはまずないと思いますが…

JavaScript

document.write('<!--[if !IE]><!-->');
/*ローカルストレージ*/
_name = "sample";
function  samplefunc(obj){
	localStorage.setItem(_name,obj);
	window.location.reload(true);
}
var _value = localStorage.getItem(_name);
if(_value == 0){
	_value = 0;
}else if(_value == 1){
	_value = 1;
}else{
	_value = 0;
}
document.write('<!--<![endif]-->');
document.write('<!--[if IE]>');
/*クッキー*/
_name = "sample";
function  samplefunc(obj){
	document.cookie = _name+"="+obj+"; expires=Fri, 31-Dec-2030 23:59:59 GMT; path=/;";
	window.location.reload(true);
}
Cookie = document.cookie+";";
_set1 = Cookie.indexOf(_name);
if(_set1 != -1){
	_set2 = Cookie.indexOf("=",_set1);
	_set3 = Cookie.indexOf(";",_set2);
	_value = Cookie.substring(_set2+1, _set3);
}else{
	_value = 0;
}
document.write('<![endif]-->');

条件分岐でIEとそれ以外で振り分けているだけです。ちなみにローカルストレージ、クッキーの順に書かないと正しく動作しません。


こうやって並べて書くとローカルストレージの書き方はクッキーより簡単になったのがわかりますね。

  • カテゴリー:Labs