js點選事件的不同寫法!
阿新 • • 發佈:2020-12-28
其實道理都一樣,換過來,換過去,萬變不離其宗。把貓叫咪咪的寫法。哈哈、
程式碼如下:
<!-- * @Descripttion: * @version: * @Author: yang_ft * @Date: 2020-12-28 16:09:20 * @github: famensaodiseng * @LastEditTime: 2020-12-28 16:27:18 --> <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>頁面模版</title> <!-- <link rel="shortcut icon" href="favicon.ico"> --> <link href="https://cdn.bootcdn.net/ajax/libs/normalize/8.0.1/normalize.css" rel="stylesheet"> <style> </style> </head> <body> <div id="box"> <input type="button" value="第一種方式" id="btn1" onclick="myFn()"> <br> <input type="button" value="第二種方式" id="btn2"><br> <input type="button" value="第三種方式" id="btn3"><br> <input type="button" value="第四種方式" id="btn4"><br> </div> <script> var btn1 = document.getElementById('btn1') // 第一種方式 function myFn() { console.log('第一種點選方式'); } var btn2 = document.getElementById('btn2'); // 第二種方式 btn2.addEventListener('click', function () { console.log('第二種點選方式'); }) var btn3 = document.getElementById('btn3'); // 第三種方式 btn3.onclick = function () { console.log('第三種點選方式'); } var btn4 = document.getElementById('btn4'); // 第四種方式 btn4.addEventListener('click', function () { console.log('第四種點選方式'); }) </script> </body> </html>