html中onclick的作用,为什么在HTML中使用onclick()是一种糟糕的做法 - 收获啦

如果使用jQuery，那么：

HTML：link

JS：$(document).ready(function() {

$("#openMap").click(function(){

popup('/map/', 300, 300, 'map');

return false;

});});

这有没有JS，或者如果用户中间点击链接的好处。

这也意味着我可以通过再次重写来处理通用弹出窗口：

HTML：link

JS：$(document).ready(function() {

$(".popup").click(function(){

popup($(this).attr("href"), 300, 300, 'map');

return false;

});});

这可以添加一个弹出窗口到任何链接，只要给它弹出的类。

这个想法可以进一步扩展如下：

HTML：link

JS：$(document).ready(function() {

$(".popup").click(function(){

popup($(this).attr("href"), $(this).data('width'), $(this).data('height'), 'map');

return false;

});});

我现在可以在整个网站上使用相同的代码来播放大量弹出窗口，而无需编写大量onclick内容！

这也意味着，如果稍后我决定弹出窗口是不好的练习，并且我想用灯箱样式窗口替换它们，我可以改变：popup($(this).attr("href"), $(this).data('width'), $(this).data('height'), 'map');

至myAmazingModalWindow($(this).attr("href"), $(this).data('width'), $(this).data('height'), 'map');

我整个网站上的所有弹出窗口现在都完全不同。我甚至可以做功能检测来决定在弹出窗口上做什么，或者存储用户偏好以允许或不允许。使用内联onclick，这需要大量的复制和粘贴工作。