<!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. Django框架(十三)——Auth模块

    Auth模块 一.什么是auth模块 Auth模块是Django自带的用户认证模块 Auth模块是Django自带的用户认证模块,可以实现包括用户注册.用户登录.用户认证.注销.修改密码等功能.默认使 ...

  2. idea中的调试按键(f5,f6,f7,f8,f9)

    f5: 如果断点处存在方法,f5 则强制进入方法内部,然后一步一步执行方法体, 如果再遇到方法,则继续进入方法体,如此循环,直到执行到断点开始处: f6: 从断点处一步步执行以后的代码,会跳出断点所在 ...

  3. 读取txt文件的数据,并将其转换为矩阵

    import numpy as nppath_txt_data = 'C:/Users/51102/Desktop/my_yolo/data/box/train.txt'def input_data( ...

  4. MyBatis和spring整合简单实现

    spring和MyBatis整合: 导入spring和MyBatis的整合jar包,以及其依赖jar包: 导入MyBatis和spring的整合jar包. spring的核心jar包. 定义Mybat ...

  5. Python进阶----UDP协议使用socket通信,socketserver模块实现并发

    Python进阶----UDP协议使用socket通信,socketserver模块实现并发 一丶基于UDP协议的socket 实现UDP协议传输数据 代码如下:

  6. k8s--yml文件3

  7. python day19 : 购物商城作业,进程与多线程

    目录 python day 19 1. 购物商城作业要求 2. 多进程 2.1 简述多进程 2.2 multiprocessing模块,创建多进程程序 2.3 if name=='main'的说明 2 ...

  8. 谷歌hack语法

    搜索标题 intitle:"登入" //加引号是精确搜索 搜索正文 intext:"登入" 在URL中搜索 inurl:"/phpmyadmin&qu ...

  9. httpclient工具类,post请求发送json字符串参数,中文乱码处理

    在使用httpclient发送post请求的时候,接收端中文乱码问题解决. 正文: 我们都知道,一般情况下使用post请求是不会出现中文乱码的.可是在使用httpclient发送post请求报文含中文 ...

  10. 如何传递大文件(GB级别)

    一.拆分:压缩工具,压缩并拆分为多个小文件. 二.QQ离线传输 QQ离线文件有限制条件: 1.离线传送的文件,为用户保存7天,逾期接收方不接收文件,系统将自动删除该文件: 2. 离线传送的文件,单个文 ...