使用window.localStorage，window.localStorage记录点击次数
<!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记录点击次数的更多相关文章
- window.location.href问题，点击，跳转到首页
onClick="window.location.href='./';" 点击,跳转到首页. location.href=url Js中实现跳转 window.location.h ...
- localStorage点击次数存储
<!DOCTYPE html><html><head><meta charset="utf-8"> <title>菜鸟教 ...
- window.parent != window 解决界面嵌套问题
页面在被嵌套的时,效果:,,如果用户点击“刷新”,该问题即可解决. 如果想通过代码解决的话,这个问题属于客户端的问题,不是服务器端的问题. 如果直接写:window.location.href = “ ...
- jquery/js记录点击事件，单击次数加一，双击清零
目的:点击按钮,点击后在网页上显示点击次数,双击清零 实现:js或者jquery 代码如下: <%@ page language="java" contentType=&qu ...
- window.parent ,window.top,window.self 详解及parent和opener的区别
window.parent ,window.top,window.self 详解 在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层fr ...
- 关于 window.parent, window.top, window.self 详解
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口,opener是用open方法打 ...
- jquery源码中的(function(window, undefined){})(window)【转】
(function( window, undefined ) {})(window);这个,为什么要将window和undefined作为参数传给它? (function( $, undefined ...
- JS 关于(function( window, undefined ) {})(window)写法的理解
JS 关于(function( window, undefined ) {})(window)写法的理解 [网络整理] (function( window, undefined ) {})(windo ...
- Javascript 中的window.parent ,window.top,window.self 详解
在应用有frameset或者iframe的页面时,parent是父窗口,top是最顶级父窗口(有的窗口中套了好几层frameset或者iframe),self是当前窗口, opener是用open方法 ...
随机推荐
- LeetCode 5214. 最长定差子序列（Java）HashMap
题目: 5214. 最长定差子序列 给你一个整数数组 arr 和一个整数 difference,请你找出 arr 中所有相邻元素之间的差等于给定 difference 的等差子序列,并返回其中最长的等 ...
- c语言 判断字符串长度 实现
/* 首先明白答案的本质(该函数)是一个计数器该计数器用for循环来实现实现对一串字符串的计数字符串以空格开头 不计算空格 计算空格后的数字直到遇到\0结束.num计算器字符串不以空格结束 计算空格后 ...
- go包管理
摘自: http://blueskykong.com/2019/02/18/go-dep-1/ https://www.cnblogs.com/apocelipes/p/10295096.html#v ...
- 解决：[ERROR] Error executing Maven. [ERROR] 1 problem was encountered while building the effective set
1. 报错如下: [ERROR] Error executing Maven. [ERROR] 1 problem was encountered while building the effecti ...
- Java Annontation 注解的学习和理解
/** * <html> * <body> * <P> Copyright 1994 JsonInternational</p> * <p> ...
- SpringBoot整合freemarker 引用基础
原 ElasticSearch学习笔记Ⅲ - SpringBoot整合ES 新建一个SpringBoot项目.添加es的maven坐标如下: <dependency> <groupI ...
- 无法定位 Local Database Runtime 安装。请验证 SQL Server Express 是否正确安装以及本地数据库运行时功能是否已启用。
错误描述: 在与 SQL Server 建立连接时出现与网络相关的或特定于实例的错误.未找到或无法访问服务器.请验证实例名称是否正确并且 SQL Server 已配置为允许远程连接. (provide ...
- 如何在CentOS / RHEL 7上启用IPv6
默认情况下,在RHEL / CenOS 7系统上启用IPv6.因此,如果故意在系统上禁用IPv6,则可以通过以下任一方法重新启用它. 1.在内核模块中启用IPv6(需要重启)2.使用sysctl设置启 ...
- spring boot 分布式锁组件 spring-boot-klock-starter
基于redis的分布式锁spring-boot starter组件,使得项目拥有分布式锁能力变得异常简单,支持spring boot,和spirng mvc等spring相关项目 快速开始 sprin ...
- SqlDataSource控件超时的困惑
想用最简单的SqlDataSource控件完成对一个记录数很多的表的查询操作,结果出现超时异常,找了些解决方法都不奏效,后来在www.codeproject.com查到高手也放弃了用控件的方法,于 ...