ホームページ > 記事 > ウェブフロントエンド > jsでのCookieの読み書き操作例を詳しく解説
Cookie には有効期間があります。Cookie のデフォルトの有効期間は、Cookie が生成されてからブラウザが閉じられるまでです。ユーザーは、Cookie の有効期間を設定して有効期限を指定することもできます。 Cookie を手動で削除するか、Cookie を手動で削除します。
Cookie は、コンピュータのハード ドライブに保存されるキーと値のペアの文字列である小さな情報です。Cookie の記憶容量は、ブラウザのメーカーによって若干異なります。 Cookie サイズの制限; Cookie の主な本質は、それを識別することによって何かを行う「識別」です。Cookie は、ハードドライブから他のデータを取得したり、コンピューター ウイルスを送信したり、電子メール アドレスを取得したりすることはできません。 Cookie には有効期間があります。Cookie のデフォルトの有効期間は、Cookie の有効期間を設定するか、手動で無効にすることによって有効期限を指定することもできます。クッキーを削除します。
Cookie は特定の形式の文字列およびテキスト文字列です
形式:
cookieName=cookieValue;expires=expiresDate; path=URLpath; domain=siteDomain //cookie名称,失效日期,储存URL,储存域值;
Cookie の作成方法
私たちは通常、Cookie の設定を関数にカプセル化します。
function addCookie(sName,sValue,day) { var expireDate = new Date(); expireDate.setDate(expireDate.getDate()+day);; //设置失效时间 document.cookie = escape(sName) + '=' + escape(sValue) +';expires=' + expireDate.toGMTString();6 //escape()汉字转成unicode编码,toGMTString() 把日期对象转成字符串 }
Cookie を読み取る
Cookie を追加した後、それを取得するにはどうすればよいでしょうか?シンプル:
function getCookies() { var showAllCookie = ''; if(!document.cookie == ''){ var arrCookie = document.cookie.split('; '); //用spilt('; ')切割所有cookie保存在数组arrCookie中 var arrLength = arrCookie.length; for(var i=0; i<arrLength; i++) { showAllCookie += 'c_name:' + unescape(arrCookie[i].split('=')[0]) + 'c_value:' + unescape(arrCookie[i].split('=')[1]) + '<br>' 9 } return showAllCookie; } }
Cookie には有効期限があり、自動的に削除することも、有効期限を設定してすぐに削除することもできます。
これも非常に簡単です。続行します。 :
function removeCookie() { if(document.cookie != '' && confirm('你想清理所有cookie吗?')) { var arrCookie = document.cookie.split('; '); var arrLength = arrCookie.length; var expireDate = new Date(); expireDate.setDate(expireDate.getDate()-1); for(var i=0; i<arrLength; i++) { var str = arrCookie[i].split('=')[0]; document.cookie = str+ '=' + ';expires=' + expireDate.toGMTString(); } } }
Cookie の作成、取得、削除の方法はすでにわかりました。次は Cookie を使用します。
Cookie を使用して簡単なタイマーを作成しましょう:
var cookieCount = {}; cookieCount.count = function () { var count = parseInt(this.getCount('myCount')); count++; document.cookie = 'myCount=' + count + ''; alert('第'+count+'访问'); } cookieCount.setCount= function () { //首先得创建一个名为myCount的cookie var expireDate = new Date(); expireDate.setDate(expireDate.getDate()+1); document.cookie = 'myCount=' + '0' +';expires=' + expireDate.toGMTString(); } cookieCount.getCount = function (countName) { //获取名为计数cookie,为其加1 var arrCookie = document.cookie.split('; '); var arrLength = arrCookie.length; var ini = true; for(var i=0; i<arrLength; i++) { if(countName == arrCookie[i].split('=')[0]){ return parseInt(arrCookie[i].split('=')[1]); break; }else{ ini = false; } } if(ini == false)this.setCount(); return 0; } cookieCount.count();
Cookie パス
Cookie パスは、この記事の冒頭で説明しました: path=URL; Cookie が作成された場合。ドメイン名のサブディレクトリ、ドメイン名および他のこの Cookie は、同じレベルのディレクトリまたは上位レベルのディレクトリからはアクセスできません。パスを設定する利点は、ドメイン名およびドメイン名のサブカテゴリ ディレクトリにアクセスできることです。次のように:
document.cookie='cookieName=cookieValue;expires=expireDate;path=/'cookie Domain
ドメインの設定:domain=siteDomain
これは主に同じドメイン内で Cookie を共有するために使用されます。 、「www.taabao.com」と「ued.taabao.com」など 「この 2 つはドメイン名「taabao.com」を共有しています。「www.taabao.com」の Cookie に「ued」がアクセスできるようにしたい場合.taabao.com" の場合、パス属性を "/" に設定し、Cookie のドメインを設定する必要があります -->document.cookie='cookieName=cookieValue;expires=expireDate;path=/;domain=taobao .com」。
Web プロジェクトの継続的な開発により、HTML5 では window.sessionStorage と window.localStorage という 2 つのプロパティが提供され、setItem、getItem、removeItem、clear などのメソッドが実装され、データをローカルに保存できるようになりました。操作がより簡単で便利になりました。
上記はこの章の全内容です。その他の関連チュートリアルについては、
JavaScript ビデオ チュートリアル