JavaScript 获取每个单词的事件

Question

通常 JavaScript 会在 DOM 元素上绑定(bind)事件。但我想知道用户点击了哪个词。对我来说熟悉的方式就是像这里一样包装每个单词:

<a href="javascript:onClick()">And</a> <a href="javascript:onClick()">now</a> <a href="javascript:onClick()">the</a>
<a href="javascript:onClick()">kung</a> <a href="javascript:onClick()">pao</a> <a href="javascript:onClick()">chicken</a>.

我觉得是多余的代码，有没有办法让代码更简洁一些？

Answer 1

好吧，您总是可以编写一个 JavaScript 函数来为您包装每个单词:

function wrapWords(element) {
    var html = element.innerHTML;
    var words = html.split(/ /);
    var newHtml = '';

    for (var i = 0; i < words.length; i++) {
        newHtml += '<span>' + words[i] + '</span> ';
    }

    element.innerHTML = newHtml; 
}

当然，这是假设元素中没有其他html。您可以将其与 Matti 的建议相结合，使代码更加整洁。