事件三要素~JS

1、事件源：哪一个标签需要发生动态改变（制作时需要获取元素改变元素和被改变元素）；

2、事件类型：指对标签执行的一系列静态页面的操作行为：如：点击、悬浮、触发未弹回、触发弹回等......

3、事件处理程序：利用函数的方法去传参改变相应数值；

1、innertext改变页面内容案例（通过注册事件去改变）

 <button id="bt">现在当前的时间</button>
    <div>点击查询</div>
    <script>
        var but = document.getElementById('bt');
        var div = document.querySelector('div')
        but.onclick = function() {
            div.innerText = timeYear();
        }

        var timeYear = function getTime() {
            //系统内定的时间不需要进行传参操作
            // 实例化一个日期对象
            var time = new Date();
            var year = time.getFullYear();
            var month = time.getMonth() + 1;
            var date = time.getDate();
            //利用三目运算符进行补零操作
            var hours = time.getHours();
            var hours = hours < 10 ? '0' + hours : hours;
            var m = time.getMinutes();
            var m = m < 10 ? '0' + m : m;
            var s = time.getSeconds();
            var s = s < 10 ? '0' + s : s;
            return '现在是' + year + '年' + month + '月' + date + '日   ' + hours + ':' + m + ':' + s;
        }
    </script>

同时我们也可以不用点击直接实现注册事件

var p = document.querySelector('p');

        p.innerText = timeYear();

页面加载出来即更新…… 

JavaScript的 DOM操作元素可以改变网页内容、结构和样式，我们可以利用DOM操作元素来改变元素里面的内容、属性等。注意以下都是属性
1改变元素内容
element.innerText
从起始位置到终止位置的内容,但它去除html标签，同时空格和换行也会去掉
elenent. innerHTML
起始位置到终止位置的全部内容，包括html标签，同时保留空格和换行