您的位置:首頁> HTML5教程> indexedDB
文章導航

indexedDB 刪除數據

2019-6-18 17:12| 作者: admin| 查看: 1468| 評論: 0|來自: 螞蟻部落

本文將通過代碼實例詳細介紹一下如何刪除indexedDB數據中的數據。

由于indexedDB數據庫并沒有表的概念,而是采用objectStore對象倉庫替代。

所以本文介紹的就是如何從objectStore對象倉庫刪除對應的數據。

關于對象倉庫參閱createObjectStore() 創建對象倉庫一章節。

首先看操作代碼實例:

[HTML] 純文本查看 復制代碼运行代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.tlmhwf.tw/" />
<title>螞蟻部落</title>
<script>
let request = window.indexedDB.open("antzone", 1);
request.onsuccess = (ev) => {
  let db = ev.target.result;
  let obt=document.getElementById("bt");
  obt.onclick = (ev) => {
    let transactionRequest = db.transaction(['students'], 'readwrite')
      .objectStore('students')
      .delete(1);
 
    transactionRequest.onsuccess = function (event) {
      console.log('刪除數據成功');
    };
 
    transactionRequest.onerror = function (event) {
      console.log('刪除數據失敗');
    }
  }
}
</script>
</head>
<body>
<input type="button" id="bt" value="查看效果"/>
</body>
</html>

上述演示如何刪除對象倉庫中的數據,數據時通過IndexedDB 數據庫新增數據一文添加。

代碼運行效果截圖如下:

aid[3350]

可以看到對象倉庫中的數據已經被刪除,并且在控制臺也打印出對應的字符串。

代碼簡單分析如下:

(1).首先,通過indexedDB.open方法打開對應的數據庫。

(2).數據庫打開成功會觸發success事件,事件處理函數會為按鈕注冊click事件處理函數。

(3).click事件處理函數會通過事務對象相關操作進行處理,indexedDB讀寫操作必須要通過事務。

(4).delete方法的參數是對應數據的主鍵,具體用法參閱IDBObjectStore.delete() 方法一章節。

更多內容不再介紹,具體可以參閱如下幾篇文章:

(1).事務可以參閱IDBTransaction 事務對象一章節。

(2).indexedDB.open可以參閱IndexedDB.open()打開與新建數據庫一章節。

(3).關于主鍵可以參閱IndexedDB 數據庫主鍵一章節。


鮮花

握手

雷人

路過

雞蛋

最新評論

返回頂部
浙江6十1开奖号码查询r