├── index.html └── src └── js └── index.js /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 7 | 8 | HW13-js-oop 9 | 10 | 11 |
12 | 13 |
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); --------------------------------------------------------------------------------