1.直接在标签上添加
<button onclick="function(1)">按钮</button>
2.用方法动态添加
//点击按钮一给按钮二添加点击事件
<button onclick="addFunction(1)">按钮一</button>
<button class="my_button">按钮二</button>
<script>
function addFunction(){
let temp = document.getElementByClassName("my_button")[0];
temp.onclick = function(){
//给按钮二添加的点击事件
}
}
</script>
3.通过监听事件添加
//点击按钮一给按钮二添加点击事件
<button onclick="addFunction(1)">按钮一</button>
<button class="my_button">按钮二</button>
<script>
function addFunction(){
let temp = document.getElementByClassName("my_button")[0];
//注:这里是用匿名函数方式添加事件的监听,无法使用方法移除监听事件
temp.addEventListener("click",function(){
//给按钮二添加的点击事件
})
}
//使用外部函数添加事件的监听,可以使用removeEventListener移除监听事件
function addFunction(){
let temp = document.getElementByClassName("my_button")[0];
temp.addEventListener("click",testFun); //注意:这里只能写函数名,不能加括号
}
//移除监听事件
function removeFunction(){
let temp = document.getElementByClassName("my_button")[0];
temp.removeEventListener("click",testFun);
//事件监听移除时需要函数的名称,这就是无法使该方法移除使用匿名函数添加的监听事件的原因
}
function testFun(){
//给按钮二添加的点击事件
}
</script>