Home > Web Front-end > JS Tutorial > Examples of common methods of Date objects in JavaScript_Basic knowledge

Examples of common methods of Date objects in JavaScript_Basic knowledge

WBOY
Release: 2016-05-16 15:35:24
Original
1653 people have browsed it

getFullYear()
Use getFullYear() to get the year.
Source code:

</script>
<!DOCTYPE html>
<html>
<body>
&#8203;
<p id="demo">Click the button to display the full year of todays date.</p>
&#8203;
<button onclick="myFunction()">Try it</button>
&#8203;
<script>
function myFunction()
{
var d = new Date();
var x = document.getElementById("demo");
x.innerHTML=d.getFullYear();
}
</script>
&#8203;
</body>
</html>     

Copy after login

Test results:

2015
Copy after login


getTime()
getTime() returns the number of milliseconds since January 1, 1970.
Source code:

<!DOCTYPE html>
<html>
<body>
&#8203;
<p id="demo">Click the button to display the number of milliseconds since midnight, January 1, 1970.</p>
&#8203;
<button onclick="myFunction()">Try it</button>
&#8203;
<script>
function myFunction()
{
var d = new Date();
var x = document.getElementById("demo");
x.innerHTML=d.getTime();
}
</script>
&#8203;
</body>
</html> 
Copy after login


Test results:

1445669203860
Copy after login

setFullYear()
How to use setFullYear() to set a specific date.
Source code:

<!DOCTYPE html>
<html>
<body>
&#8203;
<p id="demo">Click the button to display a date after changing the year, month, and day.</p>
&#8203;
<button onclick="myFunction()">Try it</button>
&#8203;
<script>
function myFunction()
{
var d = new Date();
d.setFullYear(2020,10,3);
var x = document.getElementById("demo");
x.innerHTML=d;
}
</script>
&#8203;
<p>Remember that JavaScript counts months from 0 to 11.
Month 10 is November.</p>
</body>
</html>     

Copy after login

Test results:

Tue Nov 03 2020 14:47:46 GMT+0800 (中国标准时间)
Copy after login

toUTCString()
How to use toUTCString() to convert today's date (according to UTC) to a string.

Source code:

<!DOCTYPE html>
<html>
<body>
&#8203;
<p id="demo">Click the button to display the UTC date and time as a string.</p>
&#8203;
<button onclick="myFunction()">Try it</button>
&#8203;
<script>
function myFunction()
{
var d = new Date();
var x = document.getElementById("demo");
x.innerHTML=d.toUTCString();
}
</script>
&#8203;
</body>
</html> 

Copy after login

Test results:

Sat, 24 Oct 2015 06:49:05 GMT
Copy after login

getDay()
How to use getDay() and an array to display the day of the week, not just the number.
Source code:

<!DOCTYPE html>
<html>
<body>
&#8203;
<p id="demo">Click the button to display todays day of the week.</p>
&#8203;
<button onclick="myFunction()">Try it</button>
&#8203;
<script>
function myFunction()
{
var d = new Date();
var weekday=new Array(7);
weekday[0]="Sunday";
weekday[1]="Monday";
weekday[2]="Tuesday";
weekday[3]="Wednesday";
weekday[4]="Thursday";
weekday[5]="Friday";
weekday[6]="Saturday";
&#8203;
var x = document.getElementById("demo");
x.innerHTML=weekday[d.getDay()];
}
</script>
&#8203;
</body>
</html>  
Copy after login

Test results:

Saturday
Copy after login

Display a clock
How to display a clock on a web page.
Source code:

<!DOCTYPE html>
<html>
<head>
<script>
function startTime()
{
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
// add a zero in front of numbers<10
m=checkTime(m);
s=checkTime(s);
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
t=setTimeout(function(){startTime()},500);
}
&#8203;
function checkTime(i)
{
if (i<10)
 {
 i="0" + i;
 }
return i;
}
</script>
</head>
&#8203;
<body onload="startTime()">
<div id="txt"></div>
</body>
</html>    

Copy after login


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template