JavaScript编程(小练习处理,显示时间,与倒计时)
今天再来解决JavaScript的编程题,让我们开启我们我们的编程能力,如果此文章能给你帮助,不要忘了评论与点赞哦。小编在这里先谢谢了。
1、水王数的求解,使用JavaScript编写。
水王数:在一个数组中出现的次数大于数组一半以上
(参考地址:算法题,水王数的处理(python版)_韶光不负的博客-CSDN博客)
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>水王数</title></head><body><script>//定义数组// let arr=new Array()let arr = [1, 3, 5, 5, 5, 5, 88, 5]let people=0let hp=0for (let i = 0;i<arr.length;i++) {if (hp==0){people=arr[i];hp=1}else if (arr[i] !=people){hp--}else{hp++}}let count=0for (let i = 0;i<arr.length;i++){if (people==arr[i]){count++}}if (count > 1 ){alert(people)}</script></body>
</html>
2,实现页面的秒表自动显示
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>自动的时间</title><style >#time{/* 设置居中 */text-align: center;}</style></head><body><h1 id='time'></h1><script>onload=function (){//方法function times (){//实例化对象var data=new Date()//获取h2let time =document.getElementById('time');//获取年月日时分秒let year=data.getFullYear()let month=data.getMonth()+1;let day=data.getDate()let hour=data.getHours()let miunte=data.getMinutes()let second = data.getSeconds()//设置输出格式time.innerText=year+'年'+month+'月'+day+'日 '+hour+':'+miunte+':'+second;}//调用函数times()//设置一秒调动一次setInterval(times,1000)}</script> </body>
</html>
3、js倒计时
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>倒计时</title><style >div#time{text-align:center;line-height: 150px;margin: 100px auto;font-size: 60px;height: 150px;width: 150px;border: 4px solid pink;border-radius :50%}div {/* 宽度在2秒内过渡 */ transition: width 2s;-moz-transition: width 2s; /* Firefox 4 */-webkit-transition: width 2s;/* Safari 和 Chrome */-o-transition: width 2s; /* Opera */ }div:hover {background-color: aqua;color: #000;/* 加个发光效果和下面的倒影 *//* 模糊度加到了50px */box-shadow: 0 0 50px aqua;/* below 是下倒影 1px是倒影的元素相隔的距离 最后是个渐变的颜色 */-webkit-box-reflect: below 1pxlinear-gradient(transparent, rgba(0, 0, 0, 0.3));/* 设置一下以上属性的延迟时间 */transition-delay: 0.4s;background-image: linear-gradient(#e66465, #9198e5); }</style></head><body><div id='time' class="circle"></div><script>//设置倒计时时间var num=10;//倒计时函数function countdown (){//num自减num--;//获取timelet time=document.getElementById('time');//设置time里面文字time.innerHTML = num ;//设置当时间为0停止if (num==0){clearInterval(id);}}let id = setInterval(countdown,1000)</script></body>
</html>
JavaScript编程(小练习处理,显示时间,与倒计时)相关推荐
- 天瑞地安集团:JavaScript编程小技巧让“菜鸟”编程变得更轻松!
JavaScript是最常用和使用最广泛的编程语言之一.今天要给大家分享的是天瑞地安资深程序员达达在工作中积累的一些技巧,希望对各位喜欢编程的朋友们有所帮助,这些JS开发工具不仅为程序员提供了更多可能 ...
- 【JavaScript】JavaScript编程小技巧
JS最大的特点是灵活,极端的灵活,令人发指的灵活. JS是一个弱类型语言:即JS的数据的数据类型不像其他语言那样明确或需要限定. JS的对象({}括起来的),是一些键值对组成,更愿意称它为 ...
- html在手机显示时间,手机息屏显示时间如何设置?其实息屏显示App也能帮你实现...
息屏显示究竟有什么用?据统计,手机用户每天大概会查看手机150次以上:而且动机大多数是拿起来看看时间.未读消息,完全没有点亮屏幕和解锁的必要,这时候息屏显示功能就可以派上用场了.然而这个最早在诺基亚手 ...
- android如何定时息屏_手机息屏显示时间如何设置?其实息屏显示App也能帮你实现...
息屏显示究竟有什么用?据统计,手机用户每天大概会查看手机150次以上:而且动机大多数是拿起来看看时间.未读消息,完全没有点亮屏幕和解锁的必要,这时候息屏显示功能就可以派上用场了.然而这个最早在诺基亚手 ...
- 编程小知识之时间显示
本文简述了编程中常见的时间显示问题 开发中总会在各种场景下遇到需要显示时间的情况,显示的格式要求又往往五花八门,正常的譬如: "2018年12月29日20点30分15秒", 简洁一 ...
- javascript 显示时间
javascript 显示时间 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "ht ...
- 微信小程序showToast在真机中显示时间不可控制,显示时间短
现象: 使用uniapp开发微信小程序,使用showToast,设置duration来控制提示展现时长,发现在微信开发者工具正常,在真机中显示时间比较短,并且设置duration不生效. 原因: 排查 ...
- 微信小程序中苹果iOS手机显示时间格式NaN不正确的问题
项目场景: 实现安卓Android和苹果iOS中微信小程序显示订单时间信息 问题描述 微信小程序中苹果iOS手机显示时间格式NaN不正确的问题 原因分析: 安卓微信小程序显示正常,苹果按格式YYYY- ...
- 使用定时器编程,在实时显示当前时间,每隔2秒时钟内容更新一次
编写一个java application应用程序,使用定时器编程,在实时显示当前时间,每隔2秒时钟内容更新一次. 定时器Timer类 程序代码: 运行结果: 定时器Timer类 Timer是一种定时器 ...
- 类的使用经典案例使用类的成员函数显示时间、找出元素的最大值【C++面向对象编程】
文章目录 一.普通函数显示时间 二.使用类的成员函数显示时间 三.找出元素的最大值(使用类的成员函数) 一.普通函数显示时间 #include <iostream> using names ...
最新文章
- 静态方法是一种特殊的成员方法,它不属于类的某一个具体的实例。
- 资源 | UC Berkeley CS 294深度强化学习课程(附视频、学习资料)
- pod install 失败 Сocoapods trunk URL couldn't be downloaded
- helm search搜索charts命令
- 架构师必须搞懂DNS,一篇文章就够了。
- centos5.3搭建安全高效的LNMP服务器
- Visio中如何画正弦波
- 多模态融合算法——Multimodal Compact Bilinear Pooling
- django多语言支持
- 自动驾驶仿真:VTD的SCP命令详解
- 【翻译召集令】HenCoder 反向翻译计划
- 波士顿房价数据集 Boston house prices dataset
- 架构问题--削峰填谷
- Soft Diffusion
- 名片制作:25款现代名片设计实例及模板
- 【自然语言处理】Word2Vec 词向量模型详解 + Python代码实战
- Cesium近景蓝色晴空万里天空盒子替换方法源码及图片资源-实测可用
- 课程笔记2:Scrapy框架——Selector(选择器)的用法
- 极大化思想/悬线法题集
- Win7开机自动拨号连接宽带