如题所述,项目已经写好了,是基于local_storage
存储在本地的项目
该项目运行时是基于brython
, 你可能想问,为什么不使用原生python
来编写网页呢,这个有个误区是,网页是由html
代码编写的,而原生python
想要操作DOM
非常难,所以brython
正是为这个来操作的。
初始打开页面,因为没有数据展示,所以只有一个增加按钮。
当我们点击【画个圈圈记下来】按钮后,会刷新为新增页面,例如:
此时,我们只需要输入信息,比如 记老婆的仇,缘由为 买switch游戏透露给丈母娘,还得被骂。
此时点击记仇,就可以存储到页面上了。
此时若点击已原谅,则可以删除该记录。
你可能细心发现了,哎,关掉了浏览器,下次打开,怎么还会有记录在上面呢,这是因为用了local_storage
,那么,什么是local_storage
呢?
哎,我们使用的是brython
中的local_storage
但是,它可不是python
定义的哦,而是HTML 5
提供的存储数据的API之一,可以在浏览器中保持键值对数据块。
现在来展示使用一下brython
存储和删除的操作。
导入库:
from browser.local_storage import storage
存储数据,例如键值信息juejinName
存储为pdudo
storage[juejinName] = "pdudo"
查询的话,直接使用storage[变量]
就好,若为空,则返回None
v = storage[juejinName]
循环所有的key
,需要引入window
库,再使用for...in
来完成
from browser import window for key in window.localStorage: print(key)
也可以直接使用for...in
来遍历storage
而删除数据呢?只需要像删除字典一下
del storage[juejinName]
storage
是不是操作起来和字典非常类似呢?减少了开发者的学习成本。
有了上述前置条件后,我们再看该项目,便可以总结为 针对localStorage
的增删查,首先当页面加载出来的时候,我们需要先遍历一下localstorage
数据,从而映射为一个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
,而后在定义删除按钮,等将其他值组合完毕后,全部加载进table
中,而后再页面上显示。
而添加数据呢?
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
框中的值,再判断是否用户没有输入,我们将数据组装为一个字典,而后转换为字符串,再存入localstage
中。
还有其他操作,这个可以直接看代码说明,brython
很简单的。
以上是怎么用Python编写个有趣的记仇本的详细内容。更多信息请关注PHP中文网其他相关文章!