Hướng dẫn html javascript display running time - html javascript hiển thị thời gian chạy

Chúng tôi có thể hiển thị một chiếc đồng hồ sẽ hiển thị thời gian cục bộ của máy khách bằng cách sử dụng JavaScript. Lưu ý rằng thời gian này được hiển thị được lấy từ máy tính người dùng chứ không phải từ máy chủ.

Đồng hồ thời gian thực JavaScript hiển thị thay đổi ngày và giờ ở các định dạng khác nhau

Chúng tôi đã thấy trong ví dụ đối tượng ngày của chúng tôi cách hiển thị ngày và giờ hiện tại trong đó ngày và giờ hiện tại được hiển thị một lần. Ở đây chúng tôi sẽ cố gắng hiển thị thay đổi đồng hồ hoặc thay đổi thời gian thực theo ngày và giờ bằng cách sử dụng chức năng setTimeout. Chức năng SetTimeout này mà chúng tôi đã sử dụng để kích hoạt hàm hiển thị thời gian trong tốc độ làm mới là 1000 giây (1 giây). Tốc độ làm mới này có thể được thay đổi thành bất kỳ giá trị nào khác. Bằng cách thay đổi giá trị thành 5000 đồng hồ sẽ làm mới và hiển thị thời gian chính xác một lần trong mỗi 5 giây. Đây là bản demo của tập lệnh và mã này được đưa ra dưới đây. Đây là mã

Here is the demo of this script and code is given below that.



Here is the code

Thay đổi định dạng hiển thị

Để thay đổi định dạng hiển thị, chúng ta chỉ cần thay đổi phần chức năng khi chúng ta có thể thay đổi phần hiển thị. Hãy để chúng tôi bắt đầu với việc sử dụng chuỗi UTC

function display_ct() {
var x = new Date()
var x1=x.toUTCString();// changing the display to UTC string
document.getElementById('ct').innerHTML = x1;
tt=display_c();
 }

đầu ra ở đây
Let us start with using UTC string

function display_ct() {
var x = new Date()
var x1=x.toUTCString();// changing the display to UTC string
document.getElementById('ct').innerHTML = x1;
tt=display_c();
 }

The output is here

Hiển thị trong mm/dd/yy h: m: s định dạng

Dưới đây là mã

function display_ct() {
var x = new Date()
var x1=x.getMonth() + 1+ "/" + x.getDate() + "/" + x.getFullYear(); 
x1 = x1 + " - " +  x.getHours( )+ ":" +  x.getMinutes() + ":" +  x.getSeconds();
document.getElementById('ct').innerHTML = x1;
display_c();
 }

Lưu ý rằng chúng tôi chỉ thay đổi phần hàm Display_ct (), mã khác vẫn giống nhau. Đây là đầu ra

Hiển thị AM hoặc PM có đồng hồ

Hiển thị định dạng 12 giờ

Thêm một số 0 hàng đầu vào tất cả các chữ số trong tháng, ngày, giờ, phút và giây.

Để hiển thị đồng hồ bên trong hộp văn bản

Tạo một hộp văn bản và đưa ID cho nó

để hiển thị thêm dòng này bên trong hàm display_ct ()

document.getElementById('t1').value = x;

Thay đổi kích thước phông chữ và màu phông chữ của màn hình

________số 8

Thêm 0 vào số chữ số đơn

Chúng tôi có thể hiển thị 5 giờ là 05 giờ hoặc 2 phút là 02 phút.

// date part ///
var month=x.getMonth()+1;
var day=x.getDate();
var year=x.getFullYear();
if (month <10 ){month='0' + month;}
if (day <10 ){day='0' + day;}
var x3= month+'-'+day+'-'+year;

// time part //
var hour=x.getHours();
var minute=x.getMinutes();
var second=x.getSeconds();
if(hour <10 ){hour='0'+hour;}
if(minute <10 ) {minute='0' + minute; }
if(second<10){second='0' + second;}
var x3 = x3 + ' ' +  hour+':'+minute+':'+second

Hiển thị thời gian máy chủ bằng Ajax

Kịch bản này sử dụng JavaScript để đọc thời gian máy tính của máy khách và hiển thị giống nhau. Bằng cách sử dụng PHP hoặc bất kỳ tập lệnh phía máy chủ nào khác, chúng tôi có thể hiển thị thời gian máy chủ. Nhưng ở đây chúng ta có thể nhận được một lần thời gian đó là thời điểm của trang được hiển thị từ máy chủ. Để hiển thị đồng hồ cập nhật hoặc đồng hồ thời gian thực hiển thị thời gian máy chủ, chúng tôi phải gửi yêu cầu đến máy chủ theo định kỳ. Để làm điều này, chúng tôi có thể sử dụng AJAX để có được ngày và giờ hiện tại từ máy chủ và hiển thị trong một khoảng một giây.

Chuyển đổi màn hình của đồng hồ bằng một nút (sử dụng jQuery)

Đọc cách chúng ta có thể chuyển đổi màn hình của đồng hồ bằng cách điều khiển từ một nút. Vẽ đồng hồ tương tự trên vải bằng jQuery hoặc javascript.

Draw Analog Clock on Canvas using Jquery or JavaScript.

Ngày tham chiếu đồng hồ tham chiếu của các thành phố trong các múi giờ khác nhau đặt đồng hồ báo thức bằng cách sử dụng tập lệnh chọn script script script bằng cách sử dụng setInterval ()
Set Alarm Clock using time picker script Stopwatch script using setInterval()

Làm thế nào để bạn hiển thị thời gian chạy trong javascript?

Làm thế nào để bạn hiển thị thời gian chạy trong html?

Làm cách nào để hiển thị ngày và giờ hiện tại trong HTML Textbox?

Làm cách nào để thêm ngày và giờ hệ thống trong HTML?