当前位置: 首页 > news >正文

web前端JS基础-----制作进度条

1,参考代码

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><progress id="pro" max="100" value="0"></progress><script type="text/javascript">//方法一:使用setInterval// var pro = document.getElementById("pro");// var num = 0;// var timer = setInterval(function(){// 	pro.value = num;// 	num++;// 	if(num>=100){// 		//clearInterval(timer);//取消煮熟可以使进度条重复执行// 		num = 0;// 	}// },100);//方法二:使用setTimeroutvar num2 = 0;function timer(){pro.value = num2;num2++;if(num2>=100){num2=0;//return;取消注释可以使进度条重复}setTimeout(function(){timer();},100);}timer();</script></body>
</html>

2,结果参考

http://www.lryc.cn/news/211353.html

相关文章:

  • Linux命令解压多个tar.gz包
  • Java基于SpringBoot+Vue的网上图书商城管理系统(附源码,教程)
  • Visual Studio Code的下载与安装
  • 23种设计模式在SpringCloud源码里的应用
  • 几个精致的Linux命令
  • CoDeSys系列-3、Windows运行时软PLC主站和p-net从站IO设备组网测试
  • vscode下ssh免密登录linux服务器
  • 基于jquery+html开发的json格式校验工具
  • 【面试经典150 | 栈】最小栈
  • Linux网络基础2 -- 应用层相关
  • 【Python机器学习】零基础掌握SkewedChi2Sampler内核近似特征
  • Unity Meta Quest 一体机开发(三):Oculus Integration 基本原理、概念与结构+玩家角色基本配置
  • excel 拼接字符 单元格
  • HarmonyOS 快速入门TypeScript
  • ChatGPT扩展系列之ChatExcel
  • AM@微元法和定积分的应用@平面图形面积@立体体积@曲线弧长
  • SparkStreaming【实例演示】
  • 提高抖音小店用户黏性和商品销量的有效策略
  • 提高公众意识:共同防范AI诈骗
  • MES的物料管理
  • 正点原子嵌入式linux驱动开发——Linux 多点电容触摸屏
  • Git基础命令实践
  • 微信小程序设计之页面文件pages
  • VScode 自定义主题各参数解析
  • Linux进程等待
  • python设计模式笔记1:创建型模式 工厂模式和抽象工厂模式
  • 第五章 I/O管理 一、I/O设备的基本概念和分类
  • vue3动态引入图片(:src)
  • Android-登录注册页面(第三次作业)
  • [论文精读]How Powerful are Graph Neural Networks?