今更感もありますが、久しぶりにウェブでクッキー（cookie）を使う機会があったのでまとめておきました。

普通の JavaScript だけで扱う場合と、jQuery Cookie を使って便利にする場合と、２通りで記載しています。



【JavaScript でクッキーを書き込む】
document.cookie に '名前=値' のペアを書き込む：

（例）

document.cookie = 'name1=value1';

名前にはセミコロン、カンマ、空白文字は利用できない。
値は UTF-8 で記載し、encodeURIComponent() でエンコードする。


複数の '名前=値' を書き込む場合は繰り返し実行する：

（例）

document.cookie = 'name1=value1';
document.cookie = 'name2=value2';  //. 最新の実行結果だけでなく、２つとも記憶される

パラメータで属性を指定することも可能：

（例）

document.cookie = 'name1=value1;path=/path1';   //. /path1/** 以下のパスにアクセスした場合だけ有効なクッキーを設定
document.cookie = 'name2=value2;max-age=3600';  //. クッキーの有効期限を秒数で設定（指定しないとブラウザ終了時に無効になる）
document.cookie = 'name3=value3;expires=Sun, 17 Dec 2017 01:27:14 GMT';  //. クッキーの有効期限をGMTで設定（指定しないとブラウザ終了時に無効になる）

【JavaScript でクッキーを取り出す】
document.cookie の値をそのまま参照して取り出す：

（例）

var cookies = document.cookie;  //. 有効な '名前=値' のペアが、セミコロン区切りで取得できる

【JavaScript でクッキーを削除する】
「クッキーを削除する」関数は用意されていないので、「強制的に無効にする」方法を使います：

（例）

document.cookie = 'name1=value1;expires=Sat, 1 Jan 2000 00:00:00 GMT';

【jQuery Cookie とは？】
jQuery を使ってクッキーを便利・簡単に扱えるようにしたライブラリです。このライブラリを使う前に jQuery ライブラリを読み込んで置く必要があります：

（例）

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>

【jQuery Cookie でクッキーを書き込む】
$.cookie を使って名前と値を書き込みます：

（例）

$.cookie( 'name1', 'value1' );

オプションを指定することも可能です：

（例）

$.cookie( 'name1', 'value1', { expires: 7, path: '/path1' } ); //. /path1 以下のパスを指定して７日間保持

【jQuery Cookie でクッキーを取り出す】
$.cookie を使って、名前を指定してクッキーを取り出します：

（例）

var cookie = $.cookie( 'name1' );

【jQuery Cookie でクッキーを削除する】
$.removeCookie() を使って削除します：

（例）

$.removeCookie( 'name1' );