
## 設置cookie
```
function setCookie(name,value) {
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
```
## 讀取cookie
```
function getCookie(name) {
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
return (arr=document.cookie.match(reg))?unescape(arr[2]):null;
}
```
## 刪除cookie(將cookie設置過期即可):
```
function delCookie(name) {
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}
```
*****
*****
對瀏覽器來說,使用 Web Storage 存儲鍵值對比存儲 Cookie 方式更直觀,而且容量更大
包含兩種:localStorage 和 sessionStorage
sessionStorage(臨時存儲) :為每一個數據源維持一個存儲區域,在瀏覽器打開期間存在,包括頁面重新加載;
localStorage(長期存儲) :與 sessionStorage 一樣,但是瀏覽器關閉后,數據依然會一直存在;
sessionStorage 和 localStorage 的用法基本一致,引用類型的值要轉換成JSON
## 1. 保存數據到本地
```
const info = {
name: 'Lee',
age: 20,
id: '001'
};
sessionStorage.setItem('key', JSON.stringify(info));
localStorage.setItem('key', JSON.stringify(info));
```
數據的保存可以封裝一個方法, 同樣的獲取和刪除我們都可以寫個公共方法,方便后續的調用與操作
```
function set(name,value) {
sessionStorage.setItem(name,value);
}
```
## 2. 從本地存儲獲取數據 getItem() 方法
```
var data1 = JSON.parse(sessionStorage.getItem('key'));
var data2 = JSON.parse(localStorage.getItem('key'));
```
## 3. 本地存儲中刪除某個保存的數據
```
sessionStorage.removeItem('key');
localStorage.removeItem('key');
```
## 4. 刪除所有保存的數據
```
sessionStorage.clear();
localStorage.clear();
```
## 5. 監聽本地存儲的變化
```
window.addEventListener('storage', function (e) {
console.log('key', e.key);
console.log('oldValue', e.oldValue);
console.log('newValue', e.newValue);
console.log('url', e.url);
})
```
## 6、瀏覽器查看方法
a、進入開發者工具
b、選擇 Application
c、在左側 Storage 下,查看 Local Storage 和 Session Storage
- JavaScript
- JS定義要點
- 數字千分位逗號隔開
- 數組排序
- JS字符串拼接,加逗號
- 日期計算周次
- JSON
- JS數組去重
- javascript 函數調用(HOT)
- 數組和對象重新組合,定義
- 遍歷數組,循環內容輸出,添加class
- JSON常用字段新增,對象數組重組
- js 獲取對象的鍵和值,重新組合
- 取對象的鍵和值,重組數組
- 清除數組里為空的值
- JavaScript 變量提升
- JavaScript 閉包
- JavaScript random() 隨機數
- js 多久內送到;設置當前時間延后20分鐘到達,成新時間點
- javascript 判斷當前時間是否在一個時間段內; 是否周六或者周日
- 設置當前時間延后30分鐘到達 成新時間點
- JS倒計時demo
- 數組拼接
- 時間轉換成 yy/mm/dd
- 通過字段返回信息進行文本渲染
- JavaScript replace()方法
- (去重)js計算數組里的對象的某個值相同,其余值相加
- (去重)JS比較兩個數組對象,取出不同的值
- (判重)數組對象判斷內容是否相同,分組,相同的生成對應的標簽
- JS 三元表達式(多條件)
- Typescript
- TS要點定義
- ECMAScript 6
- 模板字符串
- class語法
- JavaScript 雜談
- get和post請求的區別?
- js的事件冒泡和時間捕獲?
- 本地存儲 localStorage 和 sessionStorage 和 cookie
- WebPack和Grunt以及Gulp相比有什么特性
- js對象淺拷貝和深拷貝
- JQ事件委托
- JS如何判斷數組是Array類型
- HTML/CSS
- transform 瀏覽器識別碼
- ul li{} 和 ul>li{} 樣式的區別
- HTML-新建模板
- css 上 右 下 左 空心 箭頭
- opacity 標簽透明:div 連帶內容都被設置?
- flex 彈性布局-div之間間距問題
- CSS3 標題-線動畫-備注
- BootStrap 響應式布局
- node.js
- nodejs 本地方開發接口,配置
- node開發接口, 環境及配置,demo
- nodejs--express接收post請求參數;安裝 body-parser依賴
- mysql
- Mysql 分頁查詢及動態傳參;
- 主表和子表 一對多關系 如何查出主表信息和子表條數
- Mysql 常用命令
- Mysql 表數據聯動及插入,表A數據PUSH到表B
- char(10) 和 varchar(10) 主要的區別是什么?
- Vue.js
- vue 組件快速模版
- vue 組件的顯示隱藏,動畫效果;
- Vue 組件之間的傳值,路由傳參
- VUE中演示v-for為什么要加key
- vue 項目中引入公共方法
- Vue v-for 循環數組、對象、數字時 參數的順序
- vue 定時器常規操作及其停止
- vue常用知識點匯總
- Vue項目如何實現國際化?基于vue-i18n實現國際化經驗
- vue-i18n進行多語言切換?input標簽里面placeholder屬性
- vue中使用base64和md5
- vue 生產環境部署打包時配置;頁面不加載?字體不加載?
- vue-項目引入iview 主題定制-變量覆蓋;問題及其bug
- PHP
- 用PHP寫第一個接口
- PHP-JSON格式demo
- php 數組的循環、新加
- 微信小程序
- 微信小程序關于獲取用戶的openid的php后端代碼
- 小程序列表循環、傳參、顯示、接收
- 常用鏈接
- 環境常用操作手冊