ホームページ  >  記事  >  ウェブフロントエンド  >  はじめてのCookie(jsとjq)の理解と応用_基礎知識

はじめてのCookie(jsとjq)の理解と応用_基礎知識

WBOY
WBOYオリジナル
2016-05-16 15:06:131790ブラウズ

クッキーとは

----------------------------------------------- --- ----

Cookie はブラウザによって提供されるメカニズムで、ドキュメント オブジェクトの Cookie 属性を JavaScript に提供します。これは JavaScript によって制御できますが、JavaScript 自体のプロパティではありません。 Cookie はユーザーのハード ドライブに保存されているファイルで、通常、ブラウザがドメイン名に再度アクセスすると、Cookie が使用可能になります。したがって、Cookie は 1 つのドメイン名の下で複数の Web ページにまたがることができますが、複数のドメイン名にまたがって使用することはできません。

Cookie の使用例

----------------------------------------------- --- ----

(1) ユーザーのログイン状態を保存します。たとえば、ユーザー ID は Cookie に保存されるため、ユーザーは次回そのページにアクセスするときに再度ログインする必要がなくなります。現在、多くのフォーラムやコミュニティがこの機能を提供しています。 Cookie には有効期限を設定することもでき、制限時間が経過すると、Cookie は自動的に消去されます。したがって、システムはユーザーにログイン状態を維持するよう求めることがよくあります。一般的なオプションは 1 か月、3 か月、1 年などです。

(2) ユーザーの行動を追跡します。たとえば、天気予報 Web サイトでは、ユーザーが選択した地域に基づいて地域の気象状況を表示できます。毎回場所を選択するのは面倒ですが、Cookieを使用すると、次回ページを開くときに前回訪れた場所を記憶し、自動的に表示されるのでとても便利です。最後のユーザーの地域の気象状況。すべてがバックグラウンドで行われるため、このようなページはあたかも特定のユーザー向けにカスタマイズされているかのように見え、非常に使いやすくなります。

(3) カスタマイズされたページ。 Web サイトがスキンやレイアウトを変更する機能を提供している場合、背景色や解像度などのユーザーのオプションを記録するために Cookie が使用されることがあります。ユーザーが次回訪問するときも、前回の訪問時のインターフェイス スタイルを保存できます。

Cookieの使用方法

----------------------------------------------- --- ----

js メソッド:

function setCookie(sName, sValue, oExpires, sPath, sDomain, bSecure) { //js设置cookie 
        var sCookie = sName + '=' + encodeURIComponent(sValue); 
         if (oExpires) { 
           var date = new Date(); 
           date.setTime(date.getTime() + oExpires * 60 * 60 * 1000); 
           sCookie += '; expires=' + date.toUTCString(); 
        } 
        if (sPath) { 
           sCookie += '; path=' + sPath; 
        if (sDomain) { 
           sCookie += '; domain=' + sDomain; 
        } 
         if (bSecure) { 
           sCookie += '; secure'; 
        } 
         document.cookie = sCookie; 
 }
function getCookie(name){ //获取cookie
    var strCookie=document.cookie; 
    var arrCookie=strCookie.split("; "); 
    for(var i=0;i<arrCookie.length;i++){ 
    var arr=arrCookie[i].split("="); 
      if(arr[0]==name){
        return decodeURIComponent(arr[1]); 
      }
    } 
    return ""; 
  }
function delCookie(name){//删除cookie
// 该函数检查下cookie是否设置,如果设置了则将过期时间调到过去的时间;
//剩下就交给操作系统适当时间清理cookie啦
if (getCookie(name))
  {
      document.cookie = name + "=" + "; expires=Thu, 01-Jan-70 00:00:01 GMT";
  }
}

jq プラグイン メソッド:

jq 公式 Web サイトhttp://plugins.jquery.com/ 検索 Cookie プラグイン、サイズは数キロバイト、非常に使いやすい:

0c54930bea48f598f730c6be244850d72cacc6d41bbb37262a98f745aa00fbf0
24072ae8460dd165378b4c66bd005edd2cacc6d41bbb37262a98f745aa00fbf0

上記のライブラリファイルを導入した後の利用方法は以下の通りです。

<script>
    $.cookie('the_cookie'); //读取Cookie值 
    $.cookie('the_cookie', 'the_value'); //设置cookie的值 
    $.cookie('the_cookie', 'the_value', {expires: 7, path: '/', domain: 'jquery.com', secure: true});//新建一个cookie 包括有效期 路径 域名等 
    $.cookie('the_cookie', 'the_value'); //新建cookie 
    $.cookie('the_cookie', null); //删除一个cookie 
 </script>

Cookie (js と jq) の最初の理解と応用に関する上記の記事は、すべて編集者が共有した内容であり、参考になれば幸いです。Script Home をサポートしていただければ幸いです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。