好程序员web前端培训分享js实现实战案例

简介: 好程序员web前端培训分享js实现实战案例,实际开发中有要求用户一些行为每天一次,次日开始重新回复功能,一般前端都是通过cookie来记住用户的操作,然后进行判断当日是否还有机会,这时候需要给存储的cookie值一个有效期,让次日自动失效,重新计数,代码如下:cookie = {/** * ...

好程序员web前端培训分享js实现实战案例,实际开发中有要求用户一些行为每天一次,次日开始重新回复功能,一般前端都是通过cookie来记住用户的操作,然后进行判断当日是否还有机会,这时候需要给存储的cookie值一个有效期,让次日自动失效,重新计数,代码如下:

cookie = {

/**
 * 获取cookie
 */
get: function (name) {
    var cookieName = encodeURIComponent(name) + ‘=‘,
        cookieStart = document.cookie.indexOf(cookieName),
        cookieValue = null;
    if (~cookieStart) {
        var cookieEnd = document.cookie.indexOf(‘;‘, cookieStart);
        if (!~cookieEnd) {
            cookieEnd = document.cookie.length;
        }
        cookieValue = decodeURIComponent(document.cookie.substring(cookieStart + cookieName.length, cookieEnd));
    }
    return cookieValue;
},
/**
 * 设置cookie
 */
set: function (name, value, expires, path, domain, secure) {
    var cookie = encodeURIComponent(name) + ‘=‘ + encodeURIComponent(value);
    expires instanceof Date && (cookie += ‘; expires=‘ + expires.toGMTString());
    path && (cookie += ‘; path=‘ + path);
    domain && (cookie += ‘; domain=‘ + domain);
    secure && (cookie += ‘; secure‘);
    document.cookie = cookie;
},
/**
 * 删除cookie
 * javascript里,没有提供直接删除cookie的api,只有通过将过期时间,
 * 设置成过去的某个时间,让cookie过期,来删除。
 */
del: function (name, path, domain, secure) {
    this.set(name, ‘‘, new Date(0), path, domain, secure);
}

}

下面是存储cookie并设置有效期:

//cookie过期时间,次日凌晨
var expires = new Date(new Date(new Date().getTime() + 3024 60 60 1000).setHours(0, 0, 0, 0));

//需要存储的cookie值
var value=‘100‘
cookie.set("key", value, expires);

相关文章
|
1月前
|
自然语言处理 JavaScript 前端开发
深入理解JavaScript中的闭包:原理与实战
【10月更文挑战第12天】深入理解JavaScript中的闭包:原理与实战
|
25天前
|
JavaScript 前端开发 开发者
探索JavaScript原型链:深入理解与实战应用
【10月更文挑战第21天】探索JavaScript原型链:深入理解与实战应用
28 1
|
1月前
|
SQL 前端开发 JavaScript
Nest.js 实战 (十五):前后端分离项目部署的最佳实践
这篇文章介绍了如何使用现代前端框架Vue3和后端Node.js框架Nest.js实现的前后端分离架构的应用,并将其部署到生产环境。文章涵盖了准备阶段,包括云服务器的设置、1Panel面板的安装、数据库的安装、域名的实名认证和备案、SSL证书的申请。在部署Node服务环节,包括了Node.js环境的创建、数据库的配置、用户名和密码的设置、网站信息的填写、静态网站的部署、反向代理的配置以及可能遇到的常见问题。最后,作者总结了部署经验,并希望对读者有所帮助。
135 11
|
1月前
|
存储 JavaScript 前端开发
前端开发:Vue.js入门与实战
【10月更文挑战第9天】前端开发:Vue.js入门与实战
|
2月前
|
前端开发 JavaScript
前端一键回到顶部案例
本文介绍了如何实现网页中的一键回到顶部功能,包括两种方法:第一种是通过HTML中的锚点跳转实现快速回到顶部;第二种是使用JavaScript的`scrollTo`方法结合`requestAnimationFrame`实现滚动动画效果,让页面滚动更加平滑自然。
49 1
前端一键回到顶部案例
|
17天前
|
前端开发 JavaScript
JavaScript新纪元:ES6+特性深度解析与实战应用
【10月更文挑战第29天】本文深入解析ES6+的核心特性,包括箭头函数、模板字符串、解构赋值、Promise、模块化和类等,结合实战应用,展示如何利用这些新特性编写更加高效和优雅的代码。
34 0
|
1月前
|
数据采集 JSON 前端开发
JavaScript逆向爬虫实战分析
JavaScript逆向爬虫实战分析
|
1月前
|
前端开发 JavaScript API
JavaScript逆向爬取实战——使用Python实现列表页内容爬取(二)
JavaScript逆向爬取实战——使用Python实现列表页内容爬取(二)
|
1月前
|
前端开发 JavaScript API
JavaScript逆向爬取实战——使用Python实现列表页内容爬取(一)
JavaScript逆向爬取实战——使用Python实现列表页内容爬取(一)
|
1月前
|
存储 前端开发 Java
验证码案例 —— Kaptcha 插件介绍 后端生成验证码,前端展示并进行session验证(带完整前后端源码)
本文介绍了使用Kaptcha插件在SpringBoot项目中实现验证码的生成和验证,包括后端生成验证码、前端展示以及通过session进行验证码校验的完整前后端代码和配置过程。
107 0
验证码案例 —— Kaptcha 插件介绍 后端生成验证码,前端展示并进行session验证(带完整前后端源码)

热门文章

最新文章