一个更好的方法来使用onmouseover，onmouseleave

Question

如何在这个JSFiddle文件中更好地使用onmouseover，onmouseleave和onmousemove？ http://jsfiddle.net/Insane96MCP/xznn7g3d/5/

你可以看到我有：

document.getElementById("button1").onmouseover = function(){
    showToolTip(/*...*/);
}
document.getElementById("button1").onmouseleave = function(){
    hideTooltip(/*...*/);
}
document.getElementById("button1").onmousemove = function(){
    showTooltip(/*...*/);
}
document.getElementById("button2").onmouseover = function(){
    showTooltip(/*...*/);
}
//And so on

有一种更好的方法可以做到这一点，而不是连续堆叠它们，创建一个长的javascript？

Answer 1

使用数组和for循环

var ids = ['time', 'start', 'pause'];
for (var i = 0; i < ids.length; i++) {
    document.getElementById(ids[i]).onmouseover = function(e) {
        showTooltip(Strings.timeTooltip, e);
    };

    document.getElementById(ids[i]).onmouseleave = function(e) {
        hideTooltip();
    };

    document.getElementById(ids[i]).onmousemove = function(e) {
        showTooltip(Strings.timeTooltip, e);
    };
}

DEMO