建站
咨詢
售后
建站咨詢
新聞中心
Cookies 讓你在網(wǎng)頁(yè)中存儲(chǔ)用戶信息。
成都創(chuàng)新互聯(lián)專(zhuān)注于范縣企業(yè)網(wǎng)站建設(shè),響應(yīng)式網(wǎng)站設(shè)計(jì),商城系統(tǒng)網(wǎng)站開(kāi)發(fā)。范縣網(wǎng)站建設(shè)公司,為范縣等地區(qū)提供建站服務(wù)。全流程按需求定制設(shè)計(jì)，專(zhuān)業(yè)設(shè)計(jì)，全程項(xiàng)目跟蹤，成都創(chuàng)新互聯(lián)專(zhuān)業(yè)和態(tài)度為您提供的服務(wù)
一、什么是Cookies?
Cookie是數(shù)據(jù)，存儲(chǔ)在小文本文件中，在計(jì)算機(jī)上。
當(dāng)Web服務(wù)器向?yàn)g覽器發(fā)送網(wǎng)頁(yè)時(shí)，連接被關(guān)閉，服務(wù)器會(huì)忘記用戶的一切。Cookie是為了解決“如何記住用戶信息”而發(fā)明的。
- 當(dāng)用戶訪問(wèn)網(wǎng)頁(yè)時(shí)，他的名字可以存儲(chǔ)在cookie中。
- 下次用戶訪問(wèn)頁(yè)面時(shí)，cookie“記住”他的名字。
Cookie保存在名稱值(name:value)對(duì)中。
- username = John Doe
當(dāng)瀏覽器從服務(wù)器請(qǐng)求一個(gè)網(wǎng)頁(yè)時(shí)，將屬于該頁(yè)的cookie添加到該請(qǐng)求中。這樣服務(wù)器就獲得了必要的數(shù)據(jù)來(lái)“記住”用戶的信息。
二、使用JavaScript創(chuàng)建一個(gè)Cookie
JavaScript可以創(chuàng)建、讀取、刪除cookie，用document.cookie屬性。
使用JavaScript，Cookie可以像這樣創(chuàng)建:
- document.cookie = "username=John Doe";
可以添加一個(gè)到期日期(UTC時(shí)間)。默認(rèn)情況下，在瀏覽器關(guān)閉時(shí)刪除cookie:
- document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";
使用路徑參數(shù)，您可以告訴瀏覽器cookie屬于什么路徑。默認(rèn)情況下，cookie屬于當(dāng)前頁(yè)。
- document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
三、使用JavaScript讀一個(gè)cookie
使用JavaScript，cookie可以這樣讀取。
- var x = document.cookie;
document.cookie 將返回所有cookie在一個(gè)字符串。像: cookie1=value; cookie2=value;cookie3=value;
四、使用JavaScript更改cookie
使用JavaScript, 你可以修改cookie，像使用創(chuàng)建它的方法一樣。
- document.cookie = "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
舊的cookie被覆蓋。
五、使用JavaScript刪除Cookie
刪除cookie非常簡(jiǎn)單。
刪除cookie時(shí)不必指定cookie值，只需將過(guò)期參數(shù)設(shè)置為已過(guò)期的日期。
- document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
應(yīng)該定義cookie路徑以確保刪除正確的cookie。如果不指定路徑，一些瀏覽器不會(huì)讓你刪除cookie。
六、JavaScript Cookie 實(shí)例
將創(chuàng)建一個(gè)cookie來(lái)存儲(chǔ)訪問(wèn)者的名稱，訪客第一次到達(dá)網(wǎng)頁(yè)時(shí)，會(huì)要求他填寫(xiě)姓名。然后將該名稱存儲(chǔ)在cookie中。
下次訪客到達(dá)同一頁(yè)時(shí)，他會(huì)收到一封歡迎消息。
1. 設(shè)置cookie值
首先，創(chuàng)建一個(gè)函數(shù)，將訪問(wèn)者的名字存儲(chǔ)在cookie變量中。
- function setCookie(cname, cvalue, exdays) {
- var d = new Date();
- d.setTime(d.getTime() + (exdays*24*60*60*1000));
- var expires = "expires="+ d.toUTCString();
- document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
- }
函數(shù)解析:
上面函數(shù)的三個(gè)參數(shù)分別是：cookie的名稱(cname)，cookie的值(cvalue)，還有cookie過(guò)期的天數(shù)。
函數(shù)根據(jù)參數(shù)創(chuàng)建cookie并設(shè)置過(guò)期參數(shù)。
2. 獲得cookie值
然后，創(chuàng)建一個(gè)函數(shù)返回指定cookie的值:
3. 函數(shù)檢查cookie值
最后，創(chuàng)建檢查cookie是否設(shè)置的函數(shù)。
如果cookie被設(shè)置，它將顯示一個(gè)問(wèn)候。
如果沒(méi)有設(shè)置Cookie，它會(huì)顯示一個(gè)提示框，詢問(wèn)用戶的名字，通過(guò)調(diào)用setCookie函數(shù)，并存儲(chǔ)用戶名cookie365天。
- function checkCookie() {
- var username = getCookie("username");
- if (username != "") {
- alert("Welcome again " + username);
- } else {
- username = prompt("Please enter your name:", "");
- if (username != "" && username != null) {
- setCookie("username", username, 365);
- }
- }
- }
兩者合在一起效果展示。：
七、總結(jié)
本文基于JavaScript 基礎(chǔ)。主要介紹了瀏覽器中的cookies應(yīng)該如何去調(diào)用，如何去創(chuàng)建自己的cookies,(設(shè)置cookies 獲取cookies。檢查cookies)等等一系列常見(jiàn)的問(wèn)題都做了詳細(xì)的講解。
希望能夠幫助讀者更好的學(xué)習(xí)。
本文轉(zhuǎn)載自微信公眾號(hào)「前端進(jìn)階學(xué)習(xí)交流」，可以通過(guò)以下二維碼關(guān)注。轉(zhuǎn)載本文請(qǐng)聯(lián)系前端進(jìn)階學(xué)習(xí)交流公眾號(hào)。
當(dāng)前名稱：一篇文章帶你了解JavaScript cookies
標(biāo)題鏈接：http://m.5511xx.com/article/dpdjppp.html
