JavaScript
chengliang666
这个作者很懒,什么都没留下…
展开
-
判断当前时间是否在指定日期范围内
废话不多说,直接上代码/** * 判断当前时间是否在指定日期范围内 * @Author: Lai Chengliang * @Date: 2022/04/24 16:02 * @param date [beginDateStr] [开始日期] yyyy/MM/dd * @param date [endDateStr] [结束日期] yyyy/MM/dd * @return Boolean */export const isDuringDate = (beginDateStr, endDat原创 2022-04-24 16:18:36 · 950 阅读 · 0 评论 -
js实现数组对象去重
数组对象去重,可直接复用/** *数组对象去重 * * @param {Array} arr 去重数组 * @param {String} key 唯一标识 */deduplication(arr, key) { const obj = {} // 利用reduce方法遍历数组,reduce第一个参数是遍历要执行的函数,第二个参数是item的初始值 return arr.reduce((item, next) => { if (!obj[next[key]]) {原创 2021-04-23 11:20:19 · 341 阅读 · 0 评论 -
vxe-table安装和使用
vxe-table是一个基于vue的 PC 端表格组件,支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、扩展接口等...安装npm install xe-utils vxe-table引入import Vue from 'vue'import 'xe-utils'import VXETable from 'vxe-table'import 'vxe-table/lib/sty..原创 2021-04-15 18:15:18 · 5548 阅读 · 0 评论 -
发布订阅模式 仿写Vue事件监听手写js实现
Vue组件中,可以使用$emit,$on,$off分别来分发、监听、取消监听事件实现组件通信,比较方便;最近空闲时间手撸代码实现了发布订阅模式,可以进行组件通信。话不多说,直接上代码/** * Created by laichengliang on 2021/04/13. */const center = {}// 事件监听center.on = (eventName, callback) => { if (!center[eventName]) center[ev..原创 2021-04-14 11:16:21 · 286 阅读 · 0 评论 -
禁用f12键 开发者工具 右键菜单
disable-devtool 可以禁用所有一切可以进入开发者工具的方法,防止通过开发者工具进行的 ‘代码搬运’该库有以下特性:支持可配置是否禁用右键菜单 禁用 f12 和 ctrl+shift+i 快捷键 支持识别从浏览器菜单栏打开开发者工具并关闭当前页面 开发者可以绕过禁用 (url参数使用tk配合md5加密) 支持几乎所有浏览器(IE,360,qq浏览器,FireFox,Chrome,Edge...) 高度可配置 使用极简、体积小巧 (仅7kb) 支持npm引用和scrip...原创 2021-04-12 18:09:58 · 1146 阅读 · 2 评论 -
Promise之异步调用
原创 2020-06-02 11:29:29 · 331 阅读 · 0 评论 -
留言板JavaScript实现
html代码<div id="main" class="main"> <ul id="content" class="content"> <li class="msgContent left">hello?</li> <div style=&qu原创 2018-04-18 21:40:13 · 2885 阅读 · 3 评论 -
购物车商品计算JavaScript实现
html代码<div> <p>单价:<span>30</span></p> <input type="button" value="-" class="sub"> <input type="text" value="原创 2018-04-18 21:48:59 · 1930 阅读 · 0 评论 -
表单验证JavaScript实现正则匹配、随机验证码、密码强度、加拖拽加蒙板
要求实现如下功能: 1、正则匹配用户名 邮箱 密码 手机号 2、随机验证码 3、密码强度 4、加拖拽 加蒙版html代码<div id="mask"></div><div id="box"> <div class="box1"> <p id="D原创 2018-04-20 21:12:27 · 944 阅读 · 0 评论 -
面向对象写轮播图
html代码<div id="banner"> <ul> <li><img src="images/lbt1.jpg"></li> <li><img src="images/lbt2.jpg"/></li>原创 2018-05-17 13:14:17 · 1494 阅读 · 0 评论 -
js实现获取当前周,过去和未来周的时间段日期
function getWeekTime(){ var currentFirstDate; var formatDate = function(date){ var year = date.getFullYear()+'年'; var month = (date.getMonth()+1)+'月'; ...原创 2019-01-28 15:27:22 · 2398 阅读 · 0 评论 -
防抖和节流
1. 防抖触发高频事件后n秒内函数只会执行一次,如果n秒内高频事件再次被触发,则重新计算时间* 思路:每次触发事件时都取消之前的延时调用方法function debounce(fn) { let timeout = null; // 创建一个标记用来存放定时器的返回值 return function () { clearTimeout(timeout)...原创 2019-02-18 17:53:52 · 369 阅读 · 0 评论 -
js获取一周从开始到结束日期范围
1. 以周一作为周开始版本const getWeekDate = (year, week) => { //获取周开始日期 const getWeekStartDate = (year, week) => { // Thursday in current week decides the year. const date = new ...原创 2019-03-05 10:55:19 · 1260 阅读 · 2 评论 -
全选反选JavaScript实现
html代码<label for="all">全选</label><input type="checkbox" id="all"><div id="box"> <input type="checkbox"> <input type=&quo原创 2018-04-18 21:33:35 · 181 阅读 · 0 评论 -
瀑布流布局JavaScript实现
html代码<div id="content"> <!-- <div> <img src="img/1.jpg"> <p>人在社会上呆的久了,很容易会发生变化,比如我以前一直在想着如何发家致富,现在我只想着脱贫</p> </div> --&a原创 2018-04-18 21:18:08 · 194 阅读 · 0 评论 -
弹出对话框拖拽JavaScript实现
html代码<div id="box"></div>css代码 * { margin: 0; padding: 0; } #box { width: 100px; height: 100px; background: r...原创 2018-04-11 08:51:07 · 591 阅读 · 0 评论 -
七天免登录JavaScript实现
html代码<label for="">用户名:</label><input type="text" id="username"><label for="">密码:</label><input type="text" id="password&q原创 2018-04-16 20:47:03 · 7143 阅读 · 1 评论 -
用原生JavaScript实现简单轮播图
html代码<div id="banner"> <ul> <li><img src="images/1.jpg"></li> <li><img src="images/2.jpg"></li&g原创 2018-04-17 19:34:44 · 298 阅读 · 0 评论 -
用原生JavaScript实现无缝轮播
html代码<div id="banner"> <ul> <li><img src="images/1.jpg"></li> <li><img src="images/2.jpg"></li&g原创 2018-04-17 19:44:06 · 261 阅读 · 0 评论 -
用原生JavaScript实现淡入淡出轮播图
html代码<div id="banner"> <ul> <li><img src="images/1.jpg"></li> <li><img src="images/2.jpg"></li&g原创 2018-04-17 19:47:39 · 4554 阅读 · 1 评论 -
透明轮播原生JavaScript实现
html代码<div id="box"> <ul id="ul"> <li><a href="javascript:void(0)"><img src="images/slidepic1.jpg" alt=""/></a>原创 2018-04-17 20:46:07 · 285 阅读 · 1 评论 -
用原生JS实现旋转轮播图
html代码<div class="wrap" id="wrap"> <div class="slide" id="slide"> <ul> <li><a href="#"><img src="ima原创 2018-04-18 10:56:24 · 901 阅读 · 0 评论 -
加速运动、减速运动、弹性运动和碰撞运动JavaScript实现
html代码<div id="box"></div>css代码 * { margin: 0; padding: 0; } #box { width: 100px; height: 100px; background: r...原创 2018-04-18 18:56:24 · 1412 阅读 · 0 评论 -
回到顶部JavaScript实现
html代码<div id="box"></div>css代码 * { margin: 0; padding: 0; } body { height: 3000px; } #box { width: 100px;...原创 2018-04-18 20:42:03 · 148 阅读 · 0 评论 -
抛物线运动JavaScript实现
html代码<div id="goods"></div>css代码 * { margin: 0; padding: 0 } #goods { width: 50px; height: 50px; background: r...原创 2018-04-18 20:53:25 · 1242 阅读 · 0 评论 -
分享到JavaScript实现
html代码<div id="parent"> <span>分享到</span></div>css代码 * { margin: 0; padding: 0; } #parent { width: 200px; ...原创 2018-04-18 21:03:04 · 162 阅读 · 0 评论 -
链式运动JavaScript实现
html代码<div></div><div></div><div></div><div>你这一辈子有没有为别人拼过命</div>css代码 div { width: 100px; height: 100px;原创 2018-04-18 21:11:48 · 161 阅读 · 0 评论 -
商品图片放大镜的JavaScript实现
html代码<div id="content"> <div id="box"> <img src="imgs/1-large.jpg" class="middle"> <div id="filter"></div> &原创 2018-04-10 16:25:58 · 1088 阅读 · 6 评论