分类：js

2022
06-29

JavaScript setTimeout与setTimeinterval使用案例详解

这两个方法都可以用来在固定的时间段后去执行一段javascirpt代码，不过两者各有各的应用场景。实际上，setTimeout和setInterval的语法相同。它们都有两个参数，一个是将要执行的代码字符串，还有一个是以毫秒为单位的时间间隔，当过了那个时间段之后就将执行那段代码。不过这两个函数还是有区别的，setInterval在执行完一次代码之后，经过了那个固定的时间间隔，它还会自动重复执行代码，而setTimeout只执行一次那段代... 继续阅读 >
2022
06-13

JavaScript定时器实现限时秒杀功能

本文实例为大家分享了JavaScript实现限时秒杀功能的具体代码，供大家参考，具体内容如下文件index.html代码：<!DOCTYPEhtml><html><head><metacharset="GBK"/><title>show</title><linkrel="stylesheet"href="css/index.css"type="text/css"/></head><body><divclass="divMain"><imgsrc="img/secondBuyImg.jpg"id="imgMain"/><h3style="color:#FF0000;">距离本厂秒杀结束还剩:</h3><divid="... 继续阅读 >
2022
06-10

JavaScript实现限时秒杀功能

本文实例为大家分享了JavaScript实现限时秒杀功能的具体代码，供大家参考，具体内容如下<!DOCTYPEhtml><html><head><metacharset="utf-8"><title></title></head><body><divclass="box"><divid="d"></div><!--剩余的天数--><divid="h"></div><!--剩余的小时--><divid="m"></div><!--剩余的分钟--><divid="s"></div><!--剩余的秒数--></div><script>//设置秒杀结束时间vare... 继续阅读 >
2022
05-30

JavaScript实现年历效果

本文实例为大家分享了JavaScript实现年历效果的具体代码，供大家参考，具体内容如下<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>制作年历</title><style>body{text-align:center;}.box{margin:0auto;width:880px;}.title{background:#ccc;}table{height:200px;width:200px;font-size:12px;text-align:center;float:left;margin:10px;font-family:arial;}</style><scriptsrc="calendar.js"... 继续阅读 >
2022
05-30

JavaScript实现圆形进度条效果

本文实例为大家分享了JavaScript实现圆形进度条效果的具体代码，供大家参考，具体内容如下<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Document</title><scriptsrc="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script><style>.itemwait{... 继续阅读 >
2022
05-30

JavaScript style对象与CurrentStyle对象案例详解

JavaScript style对象与CurrentStyle对象案例详解 1、Style对象style对象代表一个单独的样式声明，可以从应用样式的文档元素访问Style对象。style对象获取的是内联样式，即元素标签中style属性的值。例子：<styletype="text/css">#div{color:gray;}</div>//内部样式<divid="div"style="color:red;"></div>//内联样式document.getElementById('id').style.color;//值为red2、currentStyle对象返回所有样式声明（包括内部、外部、内联）按css层叠规则作用于元素的最终样式。只有IE... 继续阅读 >
2022
05-30

JavaScript 使用Ckeditor+Ckfinder文件上传案例详解

JavaScript 使用Ckeditor+Ckfinder文件上传案例详解 目录一、准备工作二、解压三、开始集成一、准备工作Ckeditor_4.5.7_full+Ckfinder_java_2.6.0二、解压1.解压ckeditor，和平常文件解压相同，正常解压即可2.解压ckfinder，解压完成后进入ckfinder文件夹下，发现有CKFinderJava-2.6.0.war文件，继续解压。3.注意看红框部分三、开始集成1.准备工作完成，将图1中的ckeditor，及图3中的ckfinder文件夹拷贝到我们自己的项目的WebContent下。我在WebContent下新建了文件夹assets。2.新... 继续阅读 >
2022
05-30

js制作xml在线编辑器实例

js制作xml在线编辑器实例 目录前言在线XML编辑器的需求技术预研可视化编程VSCODE插件在线编辑器最初形态：简单的在线XML编辑器用CodeMirror做编辑器学习XML，并提取出tags规则进化形态：加载树形文件结构和全文件校验功能的在线XML编辑器左侧文件树全文件校验功能非递归遍历树IndexDB保存文件内容究极进化形态：突破浏览器沙盒限制，实现对电脑本地文件的增删改更多的功能与细节不足与总结前言一年多没更新博客了，原因是疫情期间《骑马与砍杀2》发售，然后... 继续阅读 >
2022
05-27

JavaScript中箭头函数与普通函数的区别详解

本文为大家讲解了JavaScript中箭头函数与普通函数的区别，供大家参考，具体内容如下箭头函数：letfun=()=>{console.log('lalalala');}普通函数：functionfun(){console.log('lalla');}箭头函数相当于匿名函数，并且简化了函数定义。箭头函数有两种格式，一种只包含一个表达式，连{...}和return都省略掉了。还有一种可以包含多条语句，这时候就不能省略{...}和return。箭头函数是匿名函数，不能作为构造函数，不... 继续阅读 >
2022
05-27

原生JS实现各种运动之匀速运动

本文给大家分享一个用原生JS实现的匀速运动，效果如下：需要注意的是，这种运动效果在实际的开发中用的比较少，用的更多的还是弹性运动和缓冲运动，以下是代码实现，欢迎大家复制粘贴及吐槽。<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>原生JS实现各种运动之匀速运动</title><style>#div1{width:100px;height:100... 继续阅读 >
2022
05-27

原生JS实现各种运动之复合运动

本文给大家分享一个用原生JS实现的复合运动，所谓复合运动就是在同一个进间段内不同的属性都会发生变化，效果如下：实现代码如下，欢迎大家复制粘贴及吐槽。<!DOCTYPEhtml><html><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>原生JS实现各种运动之复合运动</title><style>#div1{width:100px;height:100px;background:red;... 继续阅读 >
2022
05-24

原生JS实现实时钟表

分享一个用原生JS实现的实时钟表特效，效果如下（PS：实际指针是按360度走的，截图时只截了一部分） 上面的效果一共需要4张图片，分别是表盘、时针、分针、秒针，根据需要可以自己做图片，实现的代码如下：<!DOCTYPEhtml><html><headlang="en"><metacharset="UTF-8"><title>原生JS实现实时钟表</title><style>.clock{width:600px;height:600px;margin:100px... 继续阅读 >