功能(方法)实现案例
文章平均质量分 95
uhhuh-495
This is HuangWenJun's CSDN.
展开
-
多个倒计时使用
判断时间是否已过:function isTimeoverFunc(startTime, endTime) { //判断时间是否已过 let s = new Date(startTime); let e = new Date(endTime); let time = (s.getTime() - e.getTime()); if(time > 0){ return true; }else{ return false;原创 2020-08-05 17:58:20 · 406 阅读 · 0 评论 -
处理Array数组中的方法集合
// for循环for(let i=0; i < arr.length; i++){ // handel}// for...in:得到对像的key,数组、字符串的下标for(index in arr){ // handel}// for...of:得到数组的值// for...of循环(可循环Arrays(数组), Strings(字符串), Maps(映射), Sets(集合)等可迭代的数据结构等)// 注意: for...of 不能遍历对象for(let .原创 2020-07-30 15:27:44 · 251 阅读 · 0 评论 -
Jquery实现瀑布流
HTML:<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><script type="text/javascript" src="js/jquery-1.8.3.min.js"/>&...原创 2019-07-21 10:20:52 · 149 阅读 · 0 评论 -
省市区选择
HTML:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> select{ padding:5px 0; } .outer{ width:50...原创 2019-07-21 10:19:15 · 3676 阅读 · 1 评论 -
访客留言板 --- loadStorage
HTML:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>简单的网页留言板</title> <script type="text/javascript" src="js/index.js">&l...原创 2019-07-21 10:20:20 · 556 阅读 · 0 评论 -
手指触摸及大小控制
HTML:<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>touch测试</title> <link rel="stylesheet" type="text/css" href="css/touch.css"></head&...原创 2019-07-22 08:08:25 · 317 阅读 · 0 评论 -
轮播图
HTML:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <link type="text/css" rel="stylesheet" href="css/slider.css" /> <title>轮播图练习</title> &...原创 2019-07-21 10:20:09 · 121 阅读 · 0 评论 -
CSS实现选项卡切换
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <title>&...原创 2019-07-22 08:08:07 · 1977 阅读 · 0 评论 -
页面选项卡切换
HTML:<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><title>daohan...原创 2019-07-22 08:07:57 · 658 阅读 · 0 评论 -
图形验证码
Html:<!DOCTYPE html><html><head> <title></title> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scal...原创 2019-07-21 10:17:48 · 280 阅读 · 0 评论 -
文本验证码
HTML:<!DOCTYPE html><html><head> <title>验证码测试</title> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user...原创 2019-07-21 10:17:38 · 431 阅读 · 0 评论 -
滑动图片验证码
HTML:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>滑动拼图验证码</title> <link rel="stylesheet" href="css/jigsaw.css"></head>...原创 2019-07-22 08:07:44 · 955 阅读 · 0 评论 -
原生Js实现瀑布流
HTML:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="css/waterfall.css" /> </head> <b...原创 2019-07-21 10:20:37 · 163 阅读 · 0 评论 -
滑块门
HTML:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title>滑块门</title> <link rel="stylesheet" type="text/css" href="css/silder.css"/> <...原创 2019-07-22 08:08:40 · 154 阅读 · 0 评论 -
PC端和移动端初始页面
PC端:<!DOCTYPE html><html lang="zh-cn"><head> <!-- mate标签 --> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> &l...原创 2019-07-20 12:27:48 · 199 阅读 · 0 评论 -
Html表格转出Excel表
Html:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-eq...原创 2019-07-20 14:25:56 · 273 阅读 · 0 评论 -
Swiper使用
HTML:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Swiper实践</title> <link rel="stylesheet" type="text/css" href="css/style.css">...原创 2019-07-20 14:37:57 · 100 阅读 · 0 评论 -
生成二维码
HTML:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>生成二维码</title> <link rel="stylesheet" type="text/css" href="css/qrcode.css">...原创 2019-07-20 17:46:12 · 150 阅读 · 0 评论 -
分块轮播图 -- 无插件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no...原创 2019-07-20 17:59:28 · 183 阅读 · 0 评论 -
原生Js实现图片上传
HTML:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>showImages</title> <link rel="stylesheet" type="text/css" href="css/upi...原创 2019-07-20 18:07:08 · 2248 阅读 · 0 评论 -
JQuery实现图片上传
HTML:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>showImages</title> <link rel="stylesheet" type="text/css" href="css/upimg...原创 2019-07-20 18:19:20 · 386 阅读 · 0 评论 -
地理位置获取并显示 --- 百度地图API
HTML:<!DOCTYPE html><html> <head> <meta charset=utf-8"/> <title>Simple Map</title> <link rel="stylesheet" type="text/css" href="css/map.css...原创 2019-07-21 10:18:06 · 280 阅读 · 0 评论 -
懒加载实现
HTML:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="css/lazyload.css" /> <script type="tex...原创 2019-07-21 10:19:41 · 118 阅读 · 0 评论 -
滑动出现删除按钮
HTML:<!doctype html><html> <head> <meta charset="utf-8"> <title>左划出现删除按钮,右滑隐藏</title> <link rel="stylesheet" type="text/css" href="css/index....原创 2019-07-22 08:08:48 · 570 阅读 · 0 评论 -
滑动置顶、侧边栏显示、倒计时、一次性广告
HTML:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <ti...原创 2019-07-21 10:19:27 · 262 阅读 · 0 评论 -
事件委托
<!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Js事件委托</title> <script src="https://code.jq...原创 2019-07-20 11:49:05 · 81 阅读 · 0 评论