JSP实时显示当前系统时间的四种方式示例解析

当前位置：电视猫 > php教程>

电视猫时间： 2024-09-11 14:36:30

JSP（JavaServer Pages）作为一种动态网页技术，在服务器端生成HTML页面，因此可以方便地获取服务器的当前系统时间，并在页面上实时显示。下面就来详细介绍四种常用的方法，并给出示例代码：

方法一：使用Java内置时间类

原理： 直接在JSP页面中使用Java的java.util.Date类来获取当前时间，然后格式化输出。
示例代码：

Java

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<titl   e>JSP显示当前时间</title>
</head>
<body>
<%
    Date date = new Date();
    String strDateFormat = "yyyy-MM-dd HH:mm:ss";
    SimpleDateFormat sdf = new SimpleDateFormat(strDateFormat);
    String strDate    = sdf.format(date);
%>
当前时间：<%= strDate %>
</body>
</html>

方法二：使用JSTL标签库

原理： 利用JSTL（JSP Standard Tag Library）中的fmt:formatDate标签来格式化日期。
示例代码：

Java

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>   JSP显示当前时间</title>
</head>
<body>
<fmt:formatDate value="${new java.util.Date()}" pattern="yyyy-MM-dd HH:mm:ss" />
</body>
</html>

方法三：使用JavaScript

原理： 在JSP页面中嵌入JavaScript代码，利用JavaScript的Date对象获取客户端的时间，并通过DOM操作动态更新页面元素。
示例代码：

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSP显示当前时间</title>
</head>
<body>
<div id="currentTime"></div>
<script>
function showTime() {
    var now = new Date();
    var year = now.getFullYear();
    var month = now.getMonth() + 1;
    var day = now.getDate();
    var hour = now.getHours();
    var minute = now.getMinutes();
    var second = now.getSeconds();
    document.getElementById("   currentTime").innerHTML = year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + second;
}
setInterval(showTime, 1000);
showTime();
</script>
</body>
</html>

方法四：使用AJAX

原理： 通过AJAX技术，定时向服务器发送请求，获取最新的服务器时间，并更新页面。
示例代码：

HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSP显示当前时间</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<div id="currentTime"></div>
<script>
function updateTime() {
    $.ajax({
        url: "getCurrentTime.jsp",
        success: function(data) {
            $("#currentTime").html(data);
        }
    });
}
setInterval(updateTime, 1000);
updateTime();
</script>
</body>
</html>

getCurrentTime.jsp

Java

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
    Date date = new Date();
    String strDateFormat = "yyyy-MM-dd HH:mm:ss";
    SimpleDateFormat sdf = new SimpleDateFormat(strDateFormat);
    String strDate    = sdf.format(date);
    out.print(strDate);
%>

选择哪种方法？