menu
menu

キーワード検索

 

前月(5月)の人気記事トップ10 - 6/3/2019

  1. ( 3 ↑) 【CSS】CSSだけでドロップダウンメニュー
  2. ( 1 ↓) 【Mac】Macのユーザー名とアカウント名を変更する
  3. ( 2 ↓) 【iPhone・iPad】iPhoneのメモリを簡単に解放する方法
  4. ( 4 - ) 【CSS】スマホ対応CSSだけでドロップダウンメニュー
  5. ( 8 ↑) 【Mac】Finderにフォルダのフルパスを表示させる方法
  6. (圏外↑) 【制作Tips】画面解像度一覧表
  7. ( 10 ↑) 【制作Tips】iPad画面解像度まとめ
  8. (圏外↑) 【jQuery】入門2. jQueryをHTMLに組み込む
  9. ( 9 - ) 【WiMAX】HUAWEI W04 気づくとWi-Fiの接続が切れてる
  10. ( 6 ↓) 【決定版】フォントの設定はこれで決まり❗️
このエントリーをはてなブックマークに追加

【JavaScript】ローカルストレージとクッキー

【JavaScript】ローカルストレージとクッキー

こんにちは(・∀・)

今回はJavaScriptのローカルストレージとクッキーのサンプルをご紹介します。

ローカルストレージとクッキー

クッキーに代わり最近主流となりつつあるローカルストレージですが、未だIEでは未対応です。

今回たまたま別々の案件でローカルストレージとクッキーを使用する機会がありましたのでその覚書をかねて投稿します。

  1. ローカルストレージ
  2. クッキー
  3. ローカルストレージとクッキーを両方使用する場合
ローカルストレージ

ローカルストレージのサンプルです。

JavaScript

_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;
}
クッキー

クッキーのサンプルです。

JavaScript

_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;
}
ローカルストレージとクッキーを両方使用する場合

ローカルストレージとクッキーを同時に使用することはまずないと思いますが、一応両方使用する場合のサンプルです。

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とそれ以外で振り分けているだけです。

ローカルストレージとクッキーを同時に使用する場合、ローカルストレージ、クッキーの順に書かないと正しく動作しません。


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

  • cookie JavaScript
このエントリーをはてなブックマークに追加