<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>使用window.localStorage,window.localStorage记录点击次数</title>
</head>
<body>
<button onclick="bc()">点击</button>
<div id="result"></div>
<script>
//这里使用的window.localStorage 本地存储,一般存储5M,不同浏览器不同,只要不手动删除,则永久存储
/*function bc(){
//判断浏览器是否支持storage,不支持则提示
console.log(window.localStorage);
if (window.localStorage) {
if (localStorage.count) {
//因为localStorage只支持string类型的存储,所以这里必须转化为int 类型才可以自加
localStorage.count = parseInt(localStorage.count)+1;
}else{
//localStorage 只支持 string 类型的存储,即使下面的count = 1 ,那么也会自动存储为String类型
localStorage.count=1;
}
document.getElementById("result").innerHTML= localStorage.count;
}else{
alert('您的浏览器不支持window.localStorage');
}
}*/ //这里使用window.sessionStorage 会话存储,最多
function bc(){
if (window.sessionStorage) {
if(window.sessionStorage.count){
//因为sessionStorage只支持string类型的存储,所以这里必须转化为int 类型才可以自加
window.sessionStorage.count = parseInt(window.sessionStorage.count) + 1;
}else{
//sessionStorage 只支持 string 类型的存储,即使下面的count = 1 ,那么也会自动存储为String类型
window.sessionStorage.count = 1;
}
document.getElementById('result').innerHTML = window.sessionStorage.count;
}else{
alert('您的浏览器不支持window.sessionStorage');
}
}
</script>
</body>
</html> localStorage sessionStorage 两个一毛一样
有三种写入方式: var storage=window.localStorage;
//写入a字段
storage["a"]=1;
//写入b字段
storage.b=1;
//写入c字段
storage.setItem("c",3);

 

以下是随机生成一个 

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>localStorage,sessionStorage</title>
</head>
<body>
<button onclick="cl()">点击</button>
<div id="pg">您暂时还没有点击</div>
<script> // 随机生成一个名字
function count(){
var arrs = ['a','b','c','d','e','f','g','h','i','j','k','l','m'];
var str = '';
while(true){
//随机生成一个名称
for (var i = 0; i < 1; i++) {
var g = Math.floor(Math.random()*arrs.length);
str += arrs[g];
}
//判断是否已经存在localStorage.str
if (localStorage.str) {
alert(111);
continue;
}
return str;
}
} var count = count(); //
function cl(){
if (localStorage) {
if (localStorage.count) {
//localStorage.count属性不存在返回undefined,
//localStorage 中的 key/value 中 value的值都是以string类型存在的。
//所以下面进行自加时,必须把localStorage转化为number数据类型。
localStorage.count = parseInt(localStorage.count) + 1;
}else{
localStorage.count = 1;
}
document.getElementById('pg').innerHTML = '您已经点击了' + localStorage.count + '次了';
}else{
alert('您的浏览器不支持localStorage');
}
} </script>
</body>
</html>

  

使用window.localStorage,window.localStorage记录点击次数的更多相关文章

  1. window.location.href问题,点击,跳转到首页

    onClick="window.location.href='./';" 点击,跳转到首页. location.href=url Js中实现跳转 window.location.h ...

  2. localStorage点击次数存储

    <!DOCTYPE html><html><head><meta charset="utf-8"> <title>菜鸟教 ...

  3. window.parent != window 解决界面嵌套问题

    页面在被嵌套的时,效果:,,如果用户点击“刷新”,该问题即可解决. 如果想通过代码解决的话,这个问题属于客户端的问题,不是服务器端的问题. 如果直接写:window.location.href = “ ...

  4. jquery/js记录点击事件,单击次数加一,双击清零

    目的:点击按钮,点击后在网页上显示点击次数,双击清零 实现:js或者jquery 代码如下: <%@ page language="java" contentType=&qu ...

  5. window.parent ,window.top,window.self 详解及parent和opener的区别

    window.parent ,window.top,window.self 详解 在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层fr ...

  6. 关于 window.parent, window.top, window.self 详解

    在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口,opener是用open方法打 ...

  7. jquery源码中的(function(window, undefined){})(window)【转】

    (function( window, undefined ) {})(window);这个,为什么要将window和undefined作为参数传给它? (function( $, undefined ...

  8. JS 关于(function( window, undefined ) {})(window)写法的理解

    JS 关于(function( window, undefined ) {})(window)写法的理解 [网络整理] (function( window, undefined ) {})(windo ...

  9. Javascript 中的window.parent ,window.top,window.self 详解

    在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法 ...

随机推荐

  1. Python输出菱形

    最近准备熟悉下Python的基础语法,准备练习下输出菱形.刚好作为自己blog的开篇~~ n =10 #控制菱形的大小 for i in range(1, n): for j in range(int ...

  2. LeetCode 5073. 进击的骑士(Java)BFS

    题目:5073. 进击的骑士 一个坐标可以从 -infinity 延伸到 +infinity 的 无限大的 棋盘上,你的 骑士 驻扎在坐标为 [0, 0] 的方格里. 骑士的走法和中国象棋中的马相似, ...

  3. go语言浅析二叉树

    Hello,各位小伙伴大家好,我是小栈君,今天给大家带来的分享是关于关于二叉树相关的知识点,并用go语言实现一个二叉树和对二叉树进行遍历. 我们主要针对二叉树的概念,go实战实现二叉树的前序遍历.中序 ...

  4. shell编程必须要掌握的命令-xargs

    一,说xargs命令前,说一下什么是shell编程 什么是shell编程呢,说白了就是按一定的规则把各种命令组织起来,完成一定的事情.纯属个人理解,哈哈.不管是交互式的shell,还是非交互的shel ...

  5. 使用Mimikatz读取密码

    法一: https://github.com/gentilkiwi/mimikatz/releases/tag/2.1.1-20170813 第一条:privilege::debug //提升权限 第 ...

  6. 英语Bisynes商务

    英语bisynes商务概念的提出是改革的产物,有一个演变的过程:贸易部--商业部.外贸部--内贸部--内贸局--商务部.是内外贸一体化的概念. 中文名:商务 外文名:Business,Bisynes商 ...

  7. 如何统一管理单个任务下所有API的同步情况?

    如何统一管理单个任务下所有API的同步情况 1. 一分钟完成单个API配置 单个API的配置包含:API名称.URL地址.请求方式.参数设置.自定义高级设置. 参数允许用户填写:Text.WebSer ...

  8. Celery:Next Steps

    参考文档:http://docs.celeryproject.org/en/latest/getting-started/next-steps.html#next-steps

  9. Git管理修正(取消跟踪、合并commit)

    本文总结了最近使用Git时候遇到的两个问题: 1. 当将不必要跟踪的文件加入到仓库后如何处理? 2. 提交了多个功能相同的commit后如何处理? 总结经验 在创建仓库的一开始,就要设置号.gitig ...

  10. day 08作业 预科

    有如下值集合 [11,22,33,44,55,66,77,88,99,90...],将所有大于 66 的值保存至字典的第一个key中,将小于 66 的值保存至第二个key的值中 lt=[11,22,3 ...