HTML5中設置cookie非常簡單。Cookie是一種在客戶端（即用戶的計算機）存儲數據的技術?？梢允褂肑avaScript設置Cookie，但HTML5 API中的Document.cookie屬性 更容易使用。在下面的代碼示例中我們將展示如何設置一個名為“username”的Cookie，該Cookie的值為“John”。

document.cookie = "username=John";

為了讓Cookie在指定的時間內過期，我們需要在cookie的末尾添加“;expires=”后跟一個日期，該日期指定Cookie過期的時間。

var date = new Date();
date.setTime(date.getTime()+(2*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
document.cookie = "username=John" + expires;

為了讓Cookie只在HTTP連接的安全傳輸下可用，我們需要添加屬性“secure”。

document.cookie = "username=John; expires="+expires+"; secure";

現在我們有了一個名為“username”的Cookie，它的值為“John”，過期時間為兩天后，只在安全的HTTP連接下可用。在JavaScript中，我們可以通過簡單地調用Document.cookie屬性獲取Cookie的值。

document.cookie;

上面的代碼將返回所有可用的Cookie。如果我們只想獲取名為“username”的Cookie的值，我們可以寫如下代碼：

var nameEQ = "username=";
var ca = document.cookie.split(';');
for(var i=0;i< ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}

在這個例子中，我們將分割所有的Cookie并逐個檢查它們的值是否為“username”，如果是，返回該Cookie的值。

HTML5的Document.cookie API使設置和讀取Cookie變得非常容易。無論是設置期限還是安全傳輸，都可以通過簡單的JavaScript代碼完成。