該項(xiàng)目運(yùn)行時(shí)是基于brython，你可能想問(wèn)，為什么不使用原生python來(lái)編寫(xiě)網(wǎng)頁(yè)呢，這個(gè)有個(gè)誤區(qū)是，網(wǎng)頁(yè)是由html代碼編寫(xiě)的，而原生python想要操作DOM非常難，所以brython正是為這個(gè)來(lái)操作的。

初始打開(kāi)頁(yè)面，因?yàn)闆](méi)有數(shù)據(jù)展示，所以只有一個(gè)增加按鈕。

當(dāng)我們點(diǎn)擊【畫(huà)個(gè)圈圈記下來(lái)】按鈕后，會(huì)刷新為新增頁(yè)面，例如：

此時(shí)，我們只需要輸入信息，比如記老婆的仇，緣由為買(mǎi)switch游戲透露給丈母娘，還得被罵。

此時(shí)點(diǎn)擊記仇，就可以存儲(chǔ)到頁(yè)面上了。

此時(shí)若點(diǎn)擊已原諒，則可以刪除該記錄。

brython 之 local_storage

你可能細(xì)心發(fā)現(xiàn)了，哎，關(guān)掉了瀏覽器，下次打開(kāi)，怎么還會(huì)有記錄在上面呢，這是因?yàn)橛昧?code>local_storage，那么，什么是local_storage呢？

哎，我們使用的是brython中的local_storage但是，它可不是python定義的哦，而是HTML 5提供的存儲(chǔ)數(shù)據(jù)的API之一，可以在瀏覽器中保持鍵值對(duì)數(shù)據(jù)塊。

現(xiàn)在來(lái)展示使用一下brython存儲(chǔ)和刪除的操作。

導(dǎo)入庫(kù)：

from browser.local_storage import storage

存儲(chǔ)數(shù)據(jù)，例如鍵值信息juejinName存儲(chǔ)為pdudo

storage[juejinName] = "pdudo"

查詢的話，直接使用storage[變量]就好，若為空，則返回None

v = storage[juejinName]

循環(huán)所有的key，需要引入window庫(kù)，再使用for...in來(lái)完成

from browser import window
for key in window.localStorage:
    print(key)

也可以直接使用for...in來(lái)遍歷storage

而刪除數(shù)據(jù)呢？只需要像刪除字典一下

del storage[juejinName]

storage是不是操作起來(lái)和字典非常類似呢？減少了開(kāi)發(fā)者的學(xué)習(xí)成本。

制作項(xiàng)目

有了上述前置條件后，我們?cè)倏丛擁?xiàng)目，便可以總結(jié)為針對(duì)localStorage的增刪查，首先當(dāng)頁(yè)面加載出來(lái)的時(shí)候，我們需要先遍歷一下localstorage數(shù)據(jù)，從而映射為一個(gè)table，例如:

  for key in window.localStorage:
    tr = html.TR()
    datas = json.loads(storage[key])

    delBtn = html.BUTTON("已原諒")
    delBtn.dataset["id"] = datas["id"]
    delBtn.className = "confirm-btn"
    delBtn.bind("click",delGrudges)

    td = html.TD(delBtn+" "+time.strftime('%Y-%m-%d %H:%M:%S', time.localtime(int(datas["id"]))))
    tr <= td

    for tdVal in datas["whos"],datas["Text"]:
      td = html.TD(tdVal)
      tr <= td
        
    tb <= tr 

    userWindows <= tb

上述代碼是遍歷localStorage，而后在定義刪除按鈕，等將其他值組合完畢后，全部加載進(jìn)table中，而后再頁(yè)面上顯示。

而添加數(shù)據(jù)呢？

def saveGrudges(ev):
  getWhoVal = document["whos"].value
  getTextVal = document["textArea"].value

  if getWhoVal == "" or getTextVal == "":
    return
  
  document["saveBtn"].unbind("click")


  ids = int(time.time())
  datas = {
    "id": ids,
    "whos": getWhoVal,
    "Text": getTextVal
  }

  storage[str(ids)] = json.dumps(datas)

上述代碼，顯示獲取input和textarea框中的值，再判斷是否用戶沒(méi)有輸入，我們將數(shù)據(jù)組裝為一個(gè)字典，而后轉(zhuǎn)換為字符串，再存入localstage中。

還有其他操作，這個(gè)可以直接看代碼說(shuō)明，brython很簡(jiǎn)單的。

總結(jié)

這篇文章，是善用localStorage來(lái)作為鍵值對(duì)存儲(chǔ)，以此來(lái)保證打開(kāi)和關(guān)閉瀏覽器，不會(huì)對(duì)數(shù)據(jù)產(chǎn)生影響，整個(gè)項(xiàng)目就是圍繞這個(gè)localStorage增刪改查來(lái)操作的。

到此這篇關(guān)于利用Python編寫(xiě)個(gè)有趣的記仇本的文章就介紹到這了,更多相關(guān)Python記仇本內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: