WEB--js点击事件写法

click()和onclick()

• click 是方法，执行click就是模拟鼠标点击，同时会触发onclick事件
• onclick是事件，给element赋予一种行为

click点击事件写法

• 方式一：js添加点击事件

# demo.html

<input type="button" id="login" value="登录">

# demo.js

$(document).ready(function(){
    
    
    $('#login').click(function(){
    
    
        var name = document.getElementById("username").value;
        console.log(name)
    })
}); 

• 方式二：元素中直接加入点击事件

# demo.html

<input type="button" id="login" onclick="demo()" value="登录">

# demo.js

function demo(){
    
    
    var name = document.getElementById("username").value;
    alert(name);
}

• 方式二：addEventListener() 方法添加点击事件

$(document).ready(function(){
    
    
    document.getElementById("login").addEventListener("click", function(){
    
     
        alert(document.getElementById("username").value);
    });
});