Javascript将事件附加到类名

Question

如果我有10个项目，使用类名称keyword ：

<div class="keyword"></div>

如何在此元素上附加事件，例如click 。

我试过以下，但没有运气:(没有警报出现）

document.getElementsByClassName('.keyword').onclick = function()
{
    alert(true);
    Search.addKey(this.getElementsByClassName('name')[0].innerHTML);
}

要求：

• 没有onclick属性
• 没有jQuery或任何其他库

注意：页面加载时不会生成元素。 它们的数量可以不同，每次单击按钮例如。

我需要一种方法来附加所有标签，并在'future'中使用'keyword'类。

Answer 1

您应该委派该活动。 试试这个：

if (document.body.addEventListener)
{
    document.body.addEventListener('click',yourHandler,false);
}
else
{
    document.body.attachEvent('onclick',yourHandler);//for IE
}

function yourHandler(e)
{
    e = e || window.event;
    var target = e.target || e.srcElement;
    if (target.className.match(/keyword/))
    {
        //an element with the keyword Class was clicked
    }
}

您可以在quirksmode.com上阅读有关事件委派的更多信息。 AFAIK，这是实现您想要实现的目标的最佳方式。 这就是所有主要库（原型，jQuery，......）在幕后工作的方式

更新 ：

这是小提琴 ，它包含更多解释。 一个有趣的参考是这个页面。 它帮助我了解了IE和W3C事件的不同之处，并且，它帮助我理解了事件授权的价值和无数好处