个性化阅读
专注于IT技术分析

JavaScript的Cookie

本文概要

Cookie是信息的量的一个服务器侧和客户端侧之间持续。 Web浏览器存储在浏览的时候,该信息。

一个cookie包含的信息如一般在由分号分隔的名称 – 值对的形式的字符串。它维护用户的状态并记住用户的所有网页中的信息。

如何使用Cookie?

  • 当用户向服务器发送一个请求,那么每个该请求将被视为由不同的用户发送的一个新的请求。
  • 因此,要认识到老用户,我们需要从服务器的响应添加cookie。
  • 浏览器的客户端。
  • 现在,只要用户向服务器发送一个请求,该cookie与该请求自动添加。由于该cookie,服务器可以识别用户。
JavaScript的饼干

如何在JavaScript中创建一个Cookie?

在JavaScript中,我们可以创建,读取,更新和使用document.cookie属性删除的cookie。

下面的语法用于创建一个cookie:

document.cookie="name=value";

JavaScript的cookie例子

实例1

让我们看一个例子来设置和获取一个cookie。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
    <script>
    function setCookie()
    {
        document.cookie="username=Duke Martin";
    }
    function getCookie()
    {
        if(document.cookie.length!=0)
        {
        alert(document.cookie);
        }
        else
        {
        alert("Cookie not available");
        }
    }
    </script>

</body>
</html>

实例2

在这里,我们分别显示cookie的名称 – 值对。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
<input type="button" value="setCookie" onclick="setCookie()">
<input type="button" value="getCookie" onclick="getCookie()">
    <script>
    function setCookie()
    {
        document.cookie="username=Duke Martin";
    }
    function getCookie()
    {
        if(document.cookie.length!=0)
        {
            var array=document.cookie.split("=");
        alert("Name="+array[0]+" "+"Value="+array[1]);
        }
        else
        {
        alert("Cookie not available");
        }
    }
    </script>

</body>
</html>

实例3

在这个例子中,我们提供的颜色的选择,并且所选择的颜色值传递给该cookie。现在,Cookie保存在浏览器的用户的上上之选。所以,在重新加载网页,用户的最后的选择将显示在屏幕上。

<!DOCTYPE html>
<html>
<head>
</head>
<body>
        <select id="color" onchange="display()">
                <option value="Select Color">Select Color</option>
                <option value="yellow">Yellow</option>
                <option value="green">Green</option>
                <option value="red">Red</option>
            </select>
            <script type="text/javascript">
                function display()
                {
                    var value = document.getElementById("color").value;
                    if (value != "Select Color")
                    {
                        document.bgColor = value;
                        document.cookie = "color=" + value;
                    }
                }
                window.onload = function ()
                {
                    if (document.cookie.length != 0)
                    {
                        var array = document.cookie.split("=");
                        document.getElementById("color").value = array[1];
                        document.bgColor = array[1];
                    }
                }
            
                
            </script>
</body>
</html>
赞(0)
未经允许不得转载:srcmini » JavaScript的Cookie

评论 抢沙发

评论前必须登录!