常見的鼠標事件 |鼠標事件 | 觸發條件 | | --- | --- | | onclick | 鼠標點擊左鍵觸發 | | onmouseover | 鼠標經過觸發 | | onmouseout | 鼠標離開觸發 | | onfocus | 獲得鼠標焦點觸發 | | onblur | 失去鼠標焦點觸發 | | onmousemove | 鼠標移動觸發 | | onmouseup | 鼠標彈起觸發 | | onmousedown | 鼠標按下觸發 | ``` // 點擊按鈕顯示當前時間。 <button>顯示當前時間</button> <div>某個時間</div> <script> let myDiv = document.querySelector("div"); let myBtn = document.querySelector("button"); myBtn.onclick = function () { // innerText 修改元素內容 myDiv.innerText= getDate(); }; function getDate() { var date = new Date(); var year = date.getFullYear(); var month = date.getMonth() + 1; var day = date.getDay(); var dates = date.getDate(); var weekday = ["星期天","星期一","星期二","星期三","星期四","星期五","星期六"]; var hour = date.getHours(); var minute = date.getMinutes(); var seconds = date.getSeconds(); return "今天是 " + year + "年" + month + "月" + dates + "日" + "," + weekday[day] + ",時間是：" + hour +":" + minute +":" +seconds; } </script> ``` `innerText` 和 `innerHtml`區別 ``` // html標簽當做是字符顯示 object.innerText = "<strong>哈哈哈</strong>"； // html標簽“哈哈哈”顯示粗體 object.innerHtml= "<strong>哈哈哈</strong>"； ```