美文网首页
【兜哩开发】本地储存之save() 与 find() 方法

【兜哩开发】本地储存之save() 与 find() 方法

作者: 熙如意Xiry8881 | 来源:发表于2022-06-02 12:19 被阅读0次

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>兜哩开发(development.dliyo.cloud)</title>

</head>

<body>

<div style="border: 2px dashed #ccc;width:320px;text-align:center;">

    <label for="keyname">别名(key):</label> 

    <input type="text" id="keyname" name="keyname" class="text"/> 

    <br/> 

    <label for="sitename">网名:</label> 

    <input type="text" id="sitename" name="sitename" class="text"/> 

    <br/> 

    <label for="siteurl">网 址:</label> 

    <input type="text" id="siteurl" name="siteurl"/> 

    <br/> 

    <input type="button" onclick="save()" value="新增记录"/> 

    <hr/> 

    <label for="search_site">输入别名(key):</label> 

    <input type="text" id="search_site" name="search_site"/> 

    <input type="button" onclick="find()" value="查找网站"/> 

    <p id="find_result"></p> 

</div>

</body>

<script>

//保存数据 

function save(){ 

    var site = new Object;

    site.keyname = document.getElementById("keyname").value;

    site.sitename = document.getElementById("sitename").value; 

    site.siteurl = document.getElementById("siteurl").value;

    var str = JSON.stringify(site); // 将对象转换为字符串

    localStorage.setItem(site.keyname,str); 

    alert("保存成功");

//查找数据 

function find(){ 

    var search_site = document.getElementById("search_site").value; 

    var str = localStorage.getItem(search_site); 

    var find_result = document.getElementById("find_result");

    var site = JSON.parse(str); 

    find_result.innerHTML = search_site + "的网站名是:" + site.sitename + ",网址是:" + site.siteurl; 

}

</script>

</html>

相关文章

网友评论

      本文标题:【兜哩开发】本地储存之save() 与 find() 方法

      本文链接:https://www.haomeiwen.com/subject/eglqmrtx.html