jQuery元素绑定事件

DOCTYPE html>
html>
    head>
        meta charset="utf-8">
        title>title>
    head>
    body>
        div id="d1" class="c">嘎嘎div>
        div id="d2" class="c">咕咕div>
        用户名：input type="text" name="username" id="username" value="" />
        button type="button" id="b1">我是一个按钮button>
        script type="text/javascript" src="../images/jquery-3.4.1.min.js">script>
        script type="text/javascript">
            document.getElementById("d1").onclick = function(){
                //todo
                alert("我是js原生绑定点击事件");
            }
            $("#d2").click(function(){
                alert("我是jQuery绑定点击事件");
            })
            /* 失去焦点 */
            /* $("#username").blur(function(){
                alert("blur事件");
            }) */
            /* 得到焦点 */
            /* $("#username").focus(function(){
                alert("focus事件");
            }) */
            
            /* 键盘事件 */
            /* 键盘按下 */
            /* $("#username").keydown(function(event){
                alert("keydown事件:"+event.keyCode);
            }) */
            /* 键盘按下 */
            /* $("#username").keypress(function(event){
                alert("keydown事件:"+event.keyCode);
            }) */
            /* 键盘抬起 */
            $("#username").keyup(function(event){
                alert("keydown事件:"+event.keyCode);
            })
            
            /* 鼠标事件 */
            /* 鼠标按下 */
            /* $("#b1").mousedown(function(){
                alert("鼠标按下");
            }) */
            /* 鼠标抬起 */
            /* $("#b1").mouseup(function(){
                alert("鼠标抬起");
            }) */
            /* 鼠标移动 */
            /* $("#b1").mousemove(function(){
                alert("鼠标移动");
            }) */
            /* 鼠标移出 */
            /* $("#b1").mouseout(function(){
                alert("鼠标移出");
            }) */
            /* 鼠标移入 */
            $("#b1").mouseover(function(){
                alert("鼠标移入");
            })
        script>
    body>
html>