├── index.html
└── src
└── js
└── index.js
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
7 |
8 | HW13-js-oop
9 |
10 |
11 |
14 |
15 |
16 |
--------------------------------------------------------------------------------
/src/js/index.js:
--------------------------------------------------------------------------------
1 | let correctValueTime = (value) => {
2 | return value < 10 ? '0' + value : value
3 | }
4 |
5 | class Clock {
6 | constructor(element) {
7 | this.el = element
8 | this.el.addEventListener('click', () => this.changeFormat())
9 | this.fullDate = true
10 | }
11 | render() {
12 | this.date = new Date()
13 | let hours = correctValueTime(this.date.getHours())
14 | let minutes = correctValueTime(this.date.getMinutes())
15 | let seconds = correctValueTime(this.date.getSeconds())
16 | this.el.innerHTML = this.fullDate ? `${hours}:${minutes}:${seconds}` : `${hours}:${minutes}`
17 | }
18 | changeFormat() {
19 | this.fullDate = !this.fullDate
20 | }
21 | }
22 |
23 | let time = document.getElementById('time')
24 | let clock = new Clock(time);
25 | clock.render()
26 | setInterval(() => clock.render(), 1000);
--------------------------------------------------------------------------------