只用一个html+js来获取服务器时间并在html显示出来(只要显示时间数字 每秒变化),只能写一个html文件 jsp和后台java不能修改或增加。后台只需tomcat启动。因为我们只要取得服务器的时间,所以HEAD方法很合适。
使用Ajax每秒获取服务器的时间,然后在显示出来,但是这个用户的网络延迟比较厉害,请求的时间两三秒才到达客户端,那这样更新的时间就不准确了。
采用这样处理效果好得多,第一次页面加载时从服务器端获得时间,然后以这个时间为基准,客户端再用js每秒累加。一下代码是完整的处理:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>server time</title>
<script type="text/javascript">
function gainTime() {
if(window.ActiveXObject) {
xmlHttpRequest=new ActiveXObject("microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
xmlHttpRequest=new XMLHttpRequest();
}
xmlHttpRequest.open("HEAD","http://localhost:8088/webdemo/1.html",true);
xmlHttpRequest.send("");
xmlHttpRequest.onreadystatechange=function() {
if(xmlHttpRequest.readyState==4) {
if (xmlHttpRequest.status == 200) {
var dateStr=xmlHttpRequest.getResponseHeader("Date");
var d=new Date(dateStr);
var h = d.getHours();
var m = d.getMinutes();
var s = d.getSeconds();
m = checkTime(m);
s = checkTime(s);
var timeStr = h + ":" + m + ":" + s;
setInterval(function(){
var arr = timeStr.split(":");
if (arr[2] < 59) {
arr[2] ++;
arr[2]=checkTime(arr[2]);
} else if (arr[2] == 59 && arr[1] < 59) {
arr[1] ++;
arr[1]=checkTime(arr[1]);
arr[2] = "00";
}
if (arr[1] == 59 && arr[2] == 59 && arr[0] < 23) {
arr[0] ++;
arr[1] = "00";
arr[2] = "00";
}
if (arr[1] == 59 && arr[2] == 59 && arr[0] == 23) {
arr[0] = "00";
arr[1] = "00";
arr[1] = "00";
}
timeStr = arr.join(":");
document.getElementById("txt").innerHTML=timeStr;
},1000);
}
}
}
}
function checkTime(i) {
if (i<10) {
i="0" + i
}
return i
}
</script>
</head>
<!-- <body onload="setInterval('gainTime()',1000);"> -->
<body onload="gainTime();">
<p>welcome</p>
<div id="txt"></div>
</body>
</html>
分享到:
相关推荐
标题“纯 JS 获取服务器时间 +”所指的就是使用JavaScript代码来实现从服务器获取准确的时间信息。下面是一个简单的示例,使用了XMLHttpRequest(XHR)进行同步请求: ```javascript function getServerTime() { ...
- `js 服务器时间`:指的是JavaScript获取服务器时间的方法,如上述示例所示。 - `倒计时`:指的是使用JavaScript实现的定时器功能,用来展示从某一时间点开始的剩余时间。 5. **项目文件结构**: - `demoeee....
通过以上示例,你可以了解到如何使用纯JavaScript获取服务器时间、进行农历转换,并掌握基本的时间操作技巧。在实际项目中,结合提供的HTML时间代码(如01.html、HTML时间代码.txt)和说明(如说明.txt、01.txt),...
项目中可能使用了JavaScript进行前端验证,然后通过Ajax将数据提交到服务器进行后台验证。数据的增删改功能,如添加商品、修改商品信息或删除商品,通常通过异步请求与服务器进行交互,保持页面的即时更新,同时保证...
最后,在JavaScript部分,可以学习如何使用AJAX异步通信技术获取服务器数据,动态更新页面内容,或者使用canvas元素和JavaScript的绘图API创建图形和游戏。 总的来说,HTML5、CSS3和JavaScript的结合使得现代Web...
1. 数据加载:从服务器或本地文件中获取数据,可以是JSON、CSV或API接口返回的数据。 2. 地图渲染:利用地图库绘制世界地图、中国地图或其他特定区域地图,并进行地理定位。 3. 数据绑定:将数据与地图上的特定区域...
使用JavaScript实现文件上传到本地服务器并获取到上传后文件所在路径,是由到JavaScript,java以及html页面。这个比较好,不是在jsp上获取路径,jsp太简单了,而且过时了,所以就在html页面实现了下功能,我主要是做...
同时,可以通过AJAX异步请求获取服务器上的最新物流数据,保持大屏信息的实时性。 在智慧物流大屏的设计过程中,还需考虑以下几点: 1. 数据集成:将来自不同物流系统的数据整合到一个统一的格式,以便于JS库进行...
5. 实现数据动态加载和实时更新,例如通过AJAX从服务器获取最新数据,或者设定定时任务自动刷新图表。 6. 添加交互式地图、时间轴等高级组件,提升用户体验。 总结来说,“大屏可视化,html+CSS+JS+echarts”是一个...
在本项目"HTML+CSS+JS手机端购物车demo"中,我们将探讨如何利用前端技术栈,特别是HTML、CSS和JavaScript(以及Vue.js框架),来实现一个手机端的购物车功能。这个示例是一个获取JSON数据并使用Vue进行数据绑定和...
4. JavaScript定时器每隔一段时间(例如每秒一次)从`<video>`元素中获取一帧,并在Canvas上绘制: ```javascript var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); ...
下面是完整的js获取服务器时间代码,是使用javascript获取服务器时间的完整实例,js动态刷新服务器时间。 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; ...
此外,JavaScript还可以处理用户提交的表单数据,如验证用户输入的邮箱格式,或者发送AJAX请求获取服务器上的动态数据。 在压缩包中的"myas"文件可能包含以下内容: 1. HTML文件:通常命名为如`index.html`,这是...
例如,一个动态表单可能由HTML定义其结构,CSS设定样式,然后用JavaScript来验证用户输入,显示错误消息,或者与服务器进行异步通信。 学习HTML+JS+CSS是成为Web开发者的基石。它们的语法简洁,易于入门,但同时也...
通过JavaScript,我们可以实现用户输入验证、页面动态更新、AJAX(异步JavaScript和XML)请求以获取服务器数据,以及使用DOM(Document Object Model)操作HTML元素。JavaScript也有许多流行的库和框架,如jQuery...
2. AJAX:异步JavaScript和XML,允许不刷新页面的情况下从服务器获取数据,提高用户体验。 3. jQuery库:简化DOM操作、事件处理和动画效果,广泛应用于网页开发。 压缩包中的"所有练习"可能包含以下内容: 1. HTML...
例如,它可以与后端服务器通信,获取最新的机房环境数据,如温度、湿度、电力消耗等,并利用库如D3.js、ECharts或Highcharts等创建动态图表,实时展示这些数据的变化。同时,JavaScript还可以实现用户交互,如点击...
它使用AJAX(Asynchronous JavaScript and XML)技术与服务器通信,获取或发送文件数据。当用户上传文件后,JavaScript会解析文件内容,然后运用字符串处理和正则表达式等技术找出两文件之间的差异。 文件对比算法...
例如,通过JavaScript可以实时地从服务器获取建筑的能源消耗、环境监测等数据,并动态更新到图表上。用户还可以通过交互操作,如缩放、筛选数据,进一步探索和分析信息。 数据可视化是这个平台的核心,它能将抽象的...