前端JS必用工具【js-tool-big-box】学习,获取全球重点城市时间

我们去住一些旅馆的时候,或者一些国际性网站,经常可以看见他们的钟表会展示一些国家地区的时间,这个就是很常用的功能。但如果不常接触这个功能的开发网站呢,大家就看自己电脑右下角的时间展示,就是自己当前的具体时间了。

js-tool-big-box也增加了这个功能,希望有需求的开发者可以通过工具,获取全球一些重点城市的时间展示。

目录

1 安装引入

2 获取重点城市时间展示 

2.1 比较重点的城市

2.2 获取方法

2.3 返回数据展示

2.4 使用方法总结

3 开发者反馈


1 安装引入

执行npm命令

npm i js-tool-big-box

项目中引入timeBox对象,获取全球重点城市的时间方法,位于这个对象内:

import { timeBox } from 'js-tool-big-box';

2 获取重点城市时间展示 

2.1 比较重点的城市

目前入选的重点城市有,北京、雅加达、伦敦、纽约、巴黎、悉尼和东京,我们将通过工具方法,获取当前这7个重点城市的具体时间。为了更迎合需求,我们只展示了时分秒。

2.2 获取方法

timeBox 对象中,我们添加了getWorldTime 这个方法,用来获取详细时间

const worldTime = timeBox.getWorldTime();
console.log('=-==-=', worldTime);

2.3 返回数据展示

 

2.4 使用方法总结

 

方法名返回值入参

getWorldTime

目前7个重点城市的hour min sec值;

如果你需要按时钟效果展示,需要自行将内容嵌套到setInterval定时任务中去

 

3 开发者反馈

希望使用本工具的小伙伴们,如果在工作中,遇到一些公共方法,一些多次使用的,可以及时告诉我,不比在自己项目多次重复开发了。

近期有小伙伴说,获取法定节假日只有2024年的,希望添加往年的,这个思路就挺好的,因为这个工具希望让大家真实觉得方便,那效果就达到了。

希望有一天,大家在前端项目中,更少的去写一些公共方法,更少的去install一些第三方工具库,把更多的时间利用到业务开发中去,那就太好了。

而且我们利用csdn博客来写这个学习文档,也是想借助平台更好的反馈能力,我们一起加油吧!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/649467.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

2024年【G2电站锅炉司炉】免费试题及G2电站锅炉司炉复审考试

题库来源:安全生产模拟考试一点通公众号小程序 2024年【G2电站锅炉司炉】免费试题及G2电站锅炉司炉复审考试,包含G2电站锅炉司炉免费试题答案和解析及G2电站锅炉司炉复审考试练习。安全生产模拟考试一点通结合国家G2电站锅炉司炉考试最新大纲及G2电站锅…

新手必看!TikTok视频0播放的5大原因及解决方法

很多刚起步的TikTok卖家常会遇到一个烦心事:发布的视频播放量少得可怜,甚至有时是0播放。这确实让人挺沮丧的。到底如何突破TikTok视频总是播放量为0的瓶颈?别担心,今天为大家总结了tiktok视频播放量上不去的5种原因和相应的解决方…

以JVM新特性看Java的进化之路:从Loom到Amber的技术篇章

引言: JVM的最新特性通过在效率、功能和易用性方面的创新,对Java的未来发展产生了深远的影响。以下是几个关键特性如何塑造了Java的未来: 正文: 轻量级并发 - 项目Loom: 项目Loom通过引入虚拟线程(也被称为…

使用vue,mybatis,mysql,tomcat,axios实现简单的登录注册功能

目录 第一步环境搭建 后端: 前端: 第二步画流程图 web: service: dao层: 第三步前端代码的实现 这是开始的页面,接下来我们要到router路由下书写#login的路径 路由中的component在我们自己创建的views书写vue文件…

某安全厂商外包安服工程师面试

写在前面:本篇帖子出现的厂商and面试问题皆为up实际面试情况,厂商信息不透露,仅供师傅们参考。 背景 某知名安全厂商外包 岗位:安全服务工程师(偏售后) 薪资条件:7~9k(up所在二线…

Moto和Inter字节序

inter: 低地址按照start_bit位放低字节依次往高字节填充 MotoLsb: 低地址按照start_bit位放高字节,依次往低字节填充MotoMsb:高字节按照start_bit位放低地址,依次往高字节填充

光纤跳纤,这篇文章值得一看

光纤跳线作为光网络布线最基础的元件之一,被广泛应用于光纤链路的搭建中。 如今,光纤制造商根据应用场景的不同推出众多类型的光纤跳线,如 MPO / LC / SC / FC / ST 光纤跳线,单工/双工光纤跳线,单模/多模光纤跳线等&…

一文带你学会如何部署个人博客到云服务器,并进行域名备案与解析!

哈喽,大家好呀!这里是码农后端。之前我给大家介绍了如何快速注册一个自己的域名,并创建一台自己的阿里云ECS云服务器。本篇将介绍如何将个人博客部署到云服务器,并进行域名备案与解析。 1、域名备案 注册了域名并购买了云服务器之…

bootstrap实现天平效果

之前提到了,最近,孩子的幼儿园让家长体验“半日助教活动”,每个家长需要讲授15-20分钟的课程。作为一名程序员,实在没有能教的课程,只能做了一个小游戏,带着小朋友们熟悉数字。 在上一章博客中&#xff0c…

探索AI变现新模式:搭建小程序,畅享换脸写真、趣测音乐多重乐趣

一、AI创作系统介绍、 AI变现小程序是一种利用人工智能技术为用户提供服务,并通过某种方式实现盈利的小程序。这种小程序可以应用于多个领域,如AI动漫推文、AI绘画、AI换脸等。 AI小说生动漫推文:是一种利用AI技术和动漫制作技术&#xff0…

苹果WWDC 2024或将推出AI生成的表情符号并宣布与OpenAI的合作|TodayAI

苹果正在为即将到来的WWDC(全球开发者大会)做准备,并将展示其生成式AI技术。根据Mark Gurman在Bloomberg的《Power On》通讯中的报道,苹果将在2024年的WWDC上讲述自己的AI故事,但这可能不会像Google、Microsoft或OpenA…

宝藏功能:teamOS的文件信息总览,太好用了吧

在日常工作中,我们时常需要处理大量的文件和协作任务。有时,过多的信息和工具可能会让我们感到混乱和困扰。 但可道云的teamOS文件信息总览窗口却为我们提供了一个清晰、高效的解决方案。 一、一站式信息展示,让工作更透明 这个面板集成了许…

55页PDF|人工智能通用大模型(ChatGPT)的进展、风险与应对(附下载)

👉获取方式: 😝有需要的小伙伴,可以保存图片到wx扫描二v码免费领取【保证100%免费】🆓

OrangePi AIpro上手初体验:

OrangePi AIpro上手初体验: 1.基本外观及功能接口简介2.点亮OrangePi AIpro开发板3.OrangePi AIpro功能体验3.1.目标检测3.2.OCR文字识别3.3.图像的曝光增强3.4.系统的整体性能(运行ROS) 4.OrangePi AIpro体验总结4.1.硬件及软件生态:4.2.使用体验及性能…

医学图像分割--U-net变种

参考:医学图像分割综述:U-Net系列_医学图像 实例分割-CSDN博客 2D Unet 收缩路径:每个块包含两个连续的3 3卷积,后面是一个ReLU激活函数和最大池化层(下采样)扩展路径:该路径包括一个2 2转置卷积层(上采…

苹果手机突然白屏无反应怎么办?白屏修复办法分享!

苹果手机突然白屏无反应怎么办?下面小编就来给大家分享苹果手机突然白屏的原因和修复办法。 一般造成苹果手机出现白屏的原因如下: 系统问题:iOS系统的故障是导致苹果设备白屏无反应最常见的原因之一。例如,系统更新失败、应用冲…

OpenHarmony如何切换横竖屏?

前言 在日常开发中,大多APP可能根据实际情况直接将APP的界面方向固定,或竖屏或横屏。但在使用过程中,我们还是会遇到横竖屏切换的功能需求,可能是通过物理重力感应触发,也有可能是用户手动触发。所以本文主要带大家了…

ESP32入门:1、VSCode+PlatformIO环境搭建

文章目录 背景安装vscode安装配置中文 安装Platform IO安装PIO 新建ESP32工程参考 背景 对于刚接触单片机的同学,使用vscodeplatformIO来学习ESP32是最方便快捷的,比IDF框架简单,且比arduino文件管理性能更好。但是platformIO安装较为麻烦&a…

小苯的九宫格,小苯的好数组(排序),小苯的数字合并(字典树,前缀和)

小苯的九宫格 题目描述 运行代码 #include<iostream> using namespace std; int main(){int a[10];for(int i1;i<9;i){cin>>a[i];} string b;cin>>b;for(int i0;i<b.size();i){int pb[i]-0;cout<<a[p];} } 代码思路 定义数组&#xff1a;首先…

关于栈的简单讲解

哈喽&#xff0c;小伙伴们大家好呀&#xff0c;今天给大家带来栈、队列的那些知识点。 栈的概念 栈&#xff1a;一种特殊的线性表&#xff0c;其只允许在固定的一端进行插入和删除元素操作。 进行数据插入和删除操作的一端 称为栈顶&#xff0c;另一端称为栈底。 总结 一种线性…