如果你想讓你的cookie包含更多的信息，你可以將cookie的值設得很長．假設我們要保存某人的姓名，年齡和電話號碼：

    var the_cookie = "username:thau/age:older than the hills/phone:411";

    document.cookie="my_happy_cookie=" + escape(the_cookie);

    我用斜杠／來分割屬性名稱，用分號區(qū)別不同的屬性名稱及其屬性值．斜杠／和分號是不是絕對的選擇，你可以使用任何的字符做分割的標志，比如：

    var the_cookie = "username=thau&age=older than the hills&phone=411";

    document.cookie="my_happy_cookie=" + escape(the_cookie);

    你可以自行選擇限位器．只要你注意在對cookie解碼時也使用同樣的限位器即可．

    設置復雜的cookie時方法要復雜一些．我們建議你使用相關數(shù)組來保存所有的信息，假設我們將該cookie保存到某人的硬盤上：

    my_happy_cookie=username:thau/age:older than the hills/phone:411

    你可以將這些信息放到一個方便的相關數(shù)組中：

    function readTheCookie(the_info)
    {
        // load the cookie into a variable and unescape it
        var the_cookie = document.cookie;
        the_cookie = unescape(the_cookie);

        // separate the values from the cookie name
        var broken_cookie = the_cookie.split("=");
        var the_values = broken_cookie[1];

        // break each name:value pair into an array
        var separated_values = the_values.split("/");

        // loop through the list of name:values and load
        // up the associate array

        var property_value = "";

        for (loop=0; loop<separated_values.length; loop++) {
            property_value = separated_values[loop];
            var broken_info = property_value.split(":");
            var the_property = broken_info[0];
            var the_value = broken_info[1];
            the_info[the_property] = the_value;
        }
    }


    如果在你的JavaScript中有上面這段代碼，你可以這樣調用它：

    var cookie_information = new Array();

    readTheCookie(cookie_information);

    然后你就會正確設置了cookie_information["username"],cookie_information["age"], 和cookie_information["phone"]．

    這些看起來可能有些難以理解，但實際上并不是很難．我們一步步分析：

    var the_cookie = document.cookie; 
    將cookie賦值給一個變量．

    var the_cookie = unescape(the_cookie); 
    取消escape()的編碼

    var broken_cookie = the_cookie.split("=");
    var the_values = broken_cookie[1]; 
    使the_values等同于username:thau/age:older than the hills/phone:411. 

    var separated_values = the_values.split("/"); 
    生成一個包含３個元素名為separated_values的數(shù)組：

    separated_values[0] = "username:thau"
    separated_values[1] = "age:older than the hills"
    separated_values[2] = "phone:411"

    for (loop=0; loop<separated_values.length; loop++) {
        property_value = separated_values[loop];
        var broken_info = property_value.split(":");
        var the_property = broken_info[0];
        var the_value = broken_info[1];
        the_info[the_property] = the_value;
    }
    循環(huán)調用separated_values的３個元素．

    property_value = separated_values[loop]; 
    提取當前的name:value配對，第１個配對是username:thau．

    var broken_info = property_value.split(":"); 
    將該配對分成名為broken_info的數(shù)組中的兩個元素：

    broken_info[0] = "username"
    broken_info[1] = "thau"

    var the_property = broken_info[0]; 
    第１次經過這個循環(huán)是，the_property是"username" 
    var the_value = broken_info[1]; 
    其值是"thau"

    the_info[the_property] = the_value; 
    這里開始發(fā)回相關數(shù)組的便捷功能．它使得the_info["username"] = "thau"，所以現(xiàn)在當你需要從cookie中查找username時你只需：

    var the_name = the_info["username"];

    每次經過這個循環(huán)時，就在the_info中加入一個新元素．循環(huán)到最后時，
    the_info["username"] = "thau",
    the_info["age"] = "old as the hills" ，
    而 the_info["phone"] = 411．

    有些煩瑣，但是當你需要從cookie中輸出入大量信息時這是一個很好的辦法．當然還有別的辦法．那就是使用多重cookies．

    保存多重cookies的方法很直觀．每一個cookie都有一個名稱．上一個例子中的cookie的名稱是my_happy_cookie，我們可以這樣：

    var the_cookie ="my_happy_cookie=happiness_and_joy";

    document.cookie =the_cookie;

    要保存多重cookie，只需給每個cookie一個不同的名字．如果你要加入一個新的cookie，設置document.cookie時并不會刪除前面已經設置了的cookies，所以：

    var the_cookie ="my_happy_cookie=happiness_and_joy";

    document.cookie = the_cookie;

    var another_cookie= "my_other_cookie=more_joy_more_happiness";

    document.cookie = another_cookie;

    現(xiàn)在你需要訪問這兩個cookies，有些復雜，所以你需要明了整個過程．假設你執(zhí)行了上面的代碼，現(xiàn)在想訪問my_happy_cookie．如果你查看document.cookie的內容，你會看到：

    my_happy_cookie=happiness_and_joy;
    my_other_cookie=more_joy_more_happiness;

    這樣很直觀，但是如果你想訪問某個特定的cookie則有些困難．下面的代碼可以幫助你找出某個特定的cookie：

    function WM_readCookie(name)
    {
        //如果沒有cookie則返回false或者取得值并返回該值
        if(document.cookie == '')
            return false;
        else
            return unescape(WM_getCookieValue(name));
    }

    function WM_getCookieValue(name)
    {
        // Declare variables.
        var firstChar,lastChar;

        // Get the entire cookie string.
        // (This may have other name=value pairs in it.)
        var theBigCookie = document.cookie;

        // Grab just this cookie from theBigCookie string.
        // Find the start of 'name'.
        firstChar = theBigCookie.indexOf(name);

        // If you found it,
        if(firstChar != -1)
        {
            // skip 'name' and '='.
            firstChar += name.length + 1;

            // Find the end of the value string (i.e. the next';').
            lastChar = theBigCookie.indexOf(';', firstChar);

            if(lastChar == -1) lastChar = theBigCookie.length;

            // Return the value.
            return theBigCookie.substring(firstChar, lastChar);
        }
        else
        {
            // If there was no cookie, return false.
            return false;
        }
    }

    下面我們將學習一下cookies可以做的真正酷的內容。

    現(xiàn)在你已經學會了如何設置和讀取基本的cookie．然而基本的cookie常常在用戶關閉他的瀏覽器時會被自動刪除．有時候這樣最好因為通常的域只允許在用戶的機器上保留20個cookie．但是如果你希望將cookie保存在用戶的機器上你需要設置一個cookie失效的時間，它的格式是一種叫做GMT的特殊格式．例如：

    Mon, 27-Apr-1998 00:00:00 GMT

    要正確設置GMT不是一件容易的事，你需要計算好某個日期是星期幾．好在Javascript有一個日期的方法叫做toGMTString可以幫助你．下面是設定遠期的某個時間的一個例子：

    var the_date = new Date("December 31, 2023");

    var the_cookie_date =the_date.toGMTString();

    一旦你設置了你的cookie的失效期，你在必須在cookie設置的前面加入這條信息．因此你的cookie應該如下：

    cookie_name=blah_blah;expires=date

    通常你只需在cookie字符串中加入expires=date，然后用分號分割不同的cookie．

    下面是一個如何建立有效期直至Mayan日歷末尾的函數(shù)：

    function setCookie()
    {
        // get the information
        var the_name = prompt("What's your name?","");
        var the_date = new Date("December 31, 2023");
        var the_cookie_date =the_date.toGMTString();

        // build and save the cookie
        var the_cookie = "my_cookie=" + escape(the_name);
        the_cookie = the_cookie +";expires=" + the_cookie_date;
        document.cookie = the_cookie;
    }

    最后cookie應該如下所示：

    my_cookie=thau;expires=Fri,31-Dec-2023 00:00:00 GMT

    設置好cookie之后，它將在用戶的機器中存在直到失效期．如果你將某個cookie的失效期設置得比當前時間還早，該cookie實際上不能在用戶的機器上存活．

    此外，還有兩個注意的事項：路徑（path）和域（domain）。

    這是掌握cookie最后的一個障礙：缺省情況下cookie只能被在同一個Web服務器上同一個路徑下設置了該cookie的網(wǎng)頁讀?。?，如果在"http://chimp.webmonkey.com/food/bananas/banana_puree.htm"有一段Javascript詢問了用戶的姓名，你可能需要在你的另一個網(wǎng)頁例如主頁中訪問一個給定的名字．所以你必須設定該cookie的路徑．路徑"path"用于設置可以讀取一個cookie的最頂層的目錄．將cookie的路徑設置為你的網(wǎng)頁最頂層的目錄可以讓該該目錄下的所有網(wǎng)頁都能訪問該cookie．

    方法：在你的cookie中加入path=/; 如果你只想讓"food" 目錄中的網(wǎng)頁可以使用該cookie，則你加入path=/food;．還有一點：有些網(wǎng)站有許多小的域名，例如網(wǎng)猴可能還在"chimp.webmonkey.com," "gorilla.webmonkey.com," 和"ape.webmonkey.com." 域名下有網(wǎng)頁．缺省情況下只有"chimp.webmonkey.com" 域下的網(wǎng)頁可以讀取該cookie．如果你向讓"webmonkey.com"下的所有機器都可以讀取該cookie，我們必須在cookie中加入 "domain=webmonkey.com" ．

    要將一個cookie設置在"http://chimp.webmonkey.com/food/bananas/banana_puree.htm"并且讓所有網(wǎng)猴的網(wǎng)頁都可以利用它，我們可以這樣：

    function setCookie()
    {
        var the_name = prompt("What's your name?","");
        var the_cookie = "cookie_puss=" + escape(the_name) + ";" ;
        var the_cookie = the_cookie + "path=/;";
        var the_cookie = the_cookie + "domain=webmonkey.com;";
        document.cookie = the_cookie;
    }

    現(xiàn)在我們已經學習完了cookie的內容．希望你能夠多加練習。

最新評論