HTML中⼏种为button绑定点击事件的⽅式⽐较HTML中为button绑定事件的⽅式有三种。
例如以下标签:
<button type="submit" id="btn_submit"> submit </button>
⼀、使⽤进⾏绑定
$('#btn_submit').click(function(){
});
jquery在一个元素后追加标签⼆、使⽤原⽣js绑定
}, false);
三、直接在button标签中使⽤onclick绑定
<button type="submit" id="btn_submit" οnclick="btnAction()"> submit </button>
然后在<script>标签中定义btnAtion的⽅法
<script>
function btnAction()
{ }
</script>
⽐较:
1、使⽤jquery绑定,代码简洁,使⽤⽅便,事件绑定⽅式为追加绑定,即绑定多少个⽅法就执⾏多少个⽅法。
在单⼀绑定的条件下,由于jQuery底层其实也是js实现,所以速度区别并不⼤。⾄少“绑定”这个环节并不会成为
速度的瓶颈,除⾮页⾯上绑定事件的元素超过上万个,否则响应速度就不必纠结了,只做个事件绑定还是很快的。
所以在做负载等要求不那么严格的“⼩程序”,从维护的⾓度上,建议⽤jQuery绑定,简单清楚,最容易维护。
2、使⽤原⽣js,代码量稍⼤,事件绑定⽅式为复写绑定,即绑定多个只保留最后⼀个绑定的⽅法。
原⽣js,这是真正的熟练者的⼯具,如果能写明⽩更好。
3、使⽤onclick标签绑定,代码量不⼤,但是html前端和js前端混在⼀起,不易于维护。
原则上HTML代码只能体现⽹页的结构,具体的⾏为应该使⽤代码进⾏绑定。
如果在HTML中⽤onclick事件混杂js,会导致html前端和js前端的⼯作混在了⼀起,难以分离⼯作任务,
进⽽难以维护。这种做法临时调试可以,但如果正式成品中不应该出现,
所以不建议使⽤onclick标签⽅式进⾏绑定事件。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论