前端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博客来写这个学习文档,也是想借助平台更好的反馈能力,我们一起加油吧!
相关文章:
前端JS必用工具【js-tool-big-box】学习,获取全球重点城市时间
我们去住一些旅馆的时候,或者一些国际性网站,经常可以看见他们的钟表会展示一些国家地区的时间,这个就是很常用的功能。但如果不常接触这个功能的开发网站呢,大家就看自己电脑右下角的时间展示,就是自己当前的具体时间…...
BioTech - 将蛋白质的 PDB 格式文件 转换成 mmCIF 格式文件 (Python)
欢迎关注我的CSDN:https://spike.blog.csdn.net/ 本文地址:https://blog.csdn.net/caroline_wendy/article/details/139234247 蛋白质的三维结构信息通常可以通过两种格式的文件来获取:PDB (Protein Data Bank) 和 mmCIF (Macromolecular Crystallographic Information File…...
【编程题-错题集】奇数位丢弃(模拟 - 规律)
牛客对应题目链接:奇数位丢弃_牛客题霸_牛客网 (nowcoder.com) 一、分析题目 通过⼀两个例子的模拟,可以发现:每次起始删除的下标都是 2 的次方。根据这个规律,找到最后⼀次删除的起始位置的下标即可。 二、代码 #include <io…...
Docker安装MongoDB(Linux版)
文章目录 前言一、Docker环境的准备1.安装依赖2.安装Docker 二、使用Docker安装MongoDB1.mongo版本选取2.拉取合适的镜像3.宿主机创建MongoDB需要挂载的文件夹4.第一次无认证创建mongo用户5.启动需要认证的mongo容器 问题汇总总结 前言 本文章主要介绍在Centos系统,…...
【设计模式】JAVA Design Patterns——Commander(指挥官模式)
🔍目的 用于处理执行分布式事务时可能遇到的所有问题。 🔍解释 处理分布式事务很棘手,但如果我们不仔细处理,可能会带来不想要的后果。假设我们有一个电子商务网站,它有一个支付微服务和一个运输微服务。如果当前运输…...
解决vue3项目vite打包忽略.vue扩展名
项目打包时报could not relolve “...”,因为vite已不再默认忽略.vue扩展名。 解决方法如下: 在vite.config.js中配置vite使其忽略 .vue 扩展名(不建议忽略) 注意:即使忽略了.vue文件,在实际写的时候也要加…...
Vue基础(数据绑定、export使用)
1、简介 在使用vue开发的过程中,经常会遇到一些容易混淆的问题,因此,在本文中进行汇总操作,只有通过不断总结学习,才能更好掌握vue的使用(每天进步一点)。 2、数据绑定 在js中定义数据…...
【传知代码】基于图神经网络的知识追踪方法(论文复现)
前言:本文将深入探讨基于图神经网络的知识追踪方法,旨在通过构建知识图谱来捕捉知识之间的复杂关联,并利用图神经网络强大的表示学习能力来建模学生的学习过程。我们将首先介绍图神经网络的基本原理和关键技术,然后详细阐述如何将…...
Vue与React、Angular的比较
Vue、React和Angular是前端开发中三个流行的JavaScript框架,它们各自具有不同的特点、优势和适用场景。以下是对这三个框架的比较: 1. 基本概念 Vue:Vue是一套用于构建用户界面的渐进式框架,其核心库专注于视图层,易…...
LINQ(二) —— 流式语句
总目录 C# 语法总目录 LINQ 二 —— 流式语句 1.1 序列相关部分运算符1.2 查询相关部分运算符 1.1 序列相关部分运算符 Take 运算符:Take 是拿出序列的几个数 Skip 运算符:Skip 是跳过序列的前几个数 Reverse 运算符:Reverse 是将序列反转 …...
怎么查看MySQL服务的最大连接,已经使用的连接数?怎么配置最大连接数?
要查看和配置MySQL服务的最大连接数以及已经使用的最大连接数,可以使用以下SQL语句和步骤: 查看MySQL服务的最大连接数和已经使用的最大连接数 查看当前最大连接数: SHOW VARIABLES LIKE max_connections;查看已经使用的最大连接数ÿ…...
微信小程序毕业设计-跑腿系统项目开发实战(附源码+演示视频+LW)
大家好!我是程序猿老A,感谢您阅读本文,欢迎一键三连哦。 💞当前专栏:微信小程序毕业设计 精彩专栏推荐👇🏻👇🏻👇🏻 🎀 Python毕业设计…...
stm32通过esp8266连接阿里云平台代码讲解
连接服务器 首先,按照一定的规则,获取连接阿里服务器所需要的ClientID(客户端D)、Username(用户名)、Passward(密码),ServerIP(域名),ServerPort(…...
突发!某大厂机房掉电,MySQL数据库无法启动,紧急恢复过程...
作者:IT邦德 中国DBA联盟(ACDU)成员,10余年DBA工作经验, Oracle、PostgreSQL ACE CSDN博客专家及B站知名UP主,全网粉丝10万 擅长主流Oracle、MySQL、PG、高斯及Greenplum备份恢复, 安装迁移,性能优化、故障…...
SpringCloudAlibaba:6.2RocketMQ的普通消息的使用
简介 普通消息也叫并发消息,是发送效率最高,使用最多的一种 依赖 <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0"xmlns:xsi"http://www.w3.org/2001/XMLSch…...
vue+echart :点击趋势图中的某一点或是柱状图,出现弹窗,并传输数据
样式 在趋势图中点击某一个柱状图,出现下面的弹窗 代码实现 主要是在趋势图页面代码中,在初始化趋势图的设置中,添加对趋势图监听的点击方法 drawChart() {const chartData this.chartData;let option {};if (!chartData.xData?.len…...
2024年上半年软考什么时候查成绩?附查询流程
考试一旦结束,并不意味着与考试相关的事情也就结束了。2024年上半年信息系统项目管理师等软考考试结束后,我们还需要关注考后和证书相关的事情,比如成绩查询、证书领取等等。 2024年上半年软考成绩查询 查询时间:预计在2024年7月…...
css3实现0.5px边框
效果图 代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>css3实现0.5px边框</title><s…...
U-Net网络
U-Net网络 一、基本架构 各个箭头的解释: conv 3 * 3, ReLU:表示通过一个3 * 3的卷积层,并且该层自动附带一个非线性激活层(ReLu)copy and crop:表示进行裁剪然后再进行拼接(在channel的维度上…...
不拍视频,不直播怎么在视频号卖货赚钱?开一个它就好了!
大家好,我是电商糖果 视频号这两年看着抖音卖货的热度越来越高,也想挤进电商圈。 于是它模仿抖音推出了自己的电商平台——视频号小店。 只要商家入驻视频号小店,就可以在视频号售卖商品。 具体怎么操作呢,需要拍视频…...
RestClient
什么是RestClient RestClient 是 Elasticsearch 官方提供的 Java 低级 REST 客户端,它允许HTTP与Elasticsearch 集群通信,而无需处理 JSON 序列化/反序列化等底层细节。它是 Elasticsearch Java API 客户端的基础。 RestClient 主要特点 轻量级ÿ…...
SciencePlots——绘制论文中的图片
文章目录 安装一、风格二、1 资源 安装 # 安装最新版 pip install githttps://github.com/garrettj403/SciencePlots.git# 安装稳定版 pip install SciencePlots一、风格 简单好用的深度学习论文绘图专用工具包–Science Plot 二、 1 资源 论文绘图神器来了:一行…...
从零实现富文本编辑器#5-编辑器选区模型的状态结构表达
先前我们总结了浏览器选区模型的交互策略,并且实现了基本的选区操作,还调研了自绘选区的实现。那么相对的,我们还需要设计编辑器的选区表达,也可以称为模型选区。编辑器中应用变更时的操作范围,就是以模型选区为基准来…...
高频面试之3Zookeeper
高频面试之3Zookeeper 文章目录 高频面试之3Zookeeper3.1 常用命令3.2 选举机制3.3 Zookeeper符合法则中哪两个?3.4 Zookeeper脑裂3.5 Zookeeper用来干嘛了 3.1 常用命令 ls、get、create、delete、deleteall3.2 选举机制 半数机制(过半机制࿰…...
抖音增长新引擎:品融电商,一站式全案代运营领跑者
抖音增长新引擎:品融电商,一站式全案代运营领跑者 在抖音这个日活超7亿的流量汪洋中,品牌如何破浪前行?自建团队成本高、效果难控;碎片化运营又难成合力——这正是许多企业面临的增长困局。品融电商以「抖音全案代运营…...
如何在看板中有效管理突发紧急任务
在看板中有效管理突发紧急任务需要:设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP(Work-in-Progress)弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中,设立专门的紧急任务通道尤为重要,这能…...
LLM基础1_语言模型如何处理文本
基于GitHub项目:https://github.com/datawhalechina/llms-from-scratch-cn 工具介绍 tiktoken:OpenAI开发的专业"分词器" torch:Facebook开发的强力计算引擎,相当于超级计算器 理解词嵌入:给词语画"…...
【HTTP三个基础问题】
面试官您好!HTTP是超文本传输协议,是互联网上客户端和服务器之间传输超文本数据(比如文字、图片、音频、视频等)的核心协议,当前互联网应用最广泛的版本是HTTP1.1,它基于经典的C/S模型,也就是客…...
3-11单元格区域边界定位(End属性)学习笔记
返回一个Range 对象,只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意:它移动的位置必须是相连的有内容的单元格…...
Java + Spring Boot + Mybatis 实现批量插入
在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法:使用 MyBatis 的 <foreach> 标签和批处理模式(ExecutorType.BATCH)。 方法一:使用 XML 的 <foreach> 标签ÿ…...
