1.直接在标签中绑定
<!DOCTYPE html>
<html>
<head>
<title>直接在标签里绑定事件</title>
</head>
<body>
<input type="button" value="点我触发事件" onclick="fun1('liming')" />
<script type="text/javascript">
function fun1(name)
{
alert("欢迎:"+name)
}
</script>
</body>
2.querySelector方法绑定
<!DOCTYPE html>
<html>
<head>
<title>querySelector方法绑定</title>
</head>
<body>
<input type="button" id="b1" value="点我触发事件"/>
<script type="text/javascript">
function fun1(name)
{
alert("欢迎:"+name)
}
document.querySelector('#b1').onclick=function (){fun1('lili')}
</script>
</body>
</html>
3.getElementByID方法绑定
<!DOCTYPE html>
<html>
<head>
<title>getElementByID方法绑定</title>
</head>
<body>
<input type="button" id="b1" value="点我触发事件"/>
<script type="text/javascript">
function fun1(name)
{
alert("欢迎:"+name)
}
document.getElementById('b1').onclick=function (){fun1('lili')}
</script>
</body>
</html>
4.JQuery的原生方法绑定
<!DOCTYPE html>
<html>
<head>
<title>JQuery的原生方法绑定</title>
<script src="http://cdn.bootcss.com/jquery/3.1.0/jquery.min.js"></script>
</head>
<body>
<input type="button" id="b1" value="点我触发事件"/>
<script type="text/javascript">
function fun1(name)
{
alert("欢迎:"+name)
}
$('#b1').click(function (){fun1('lili')});
</script>
</body>
</html>