javascript - 如何使用 Prototype 突出显示表格行？

Question

我如何使用 Prototype 库并创建不显眼的 javascript 来将 onmouseover 和 onmouseout 事件注入(inject)每一行，而不是将 javascript 放在每个表格行标记中？

使用原型(prototype)库(而不是 mootools、jQuery 等)的答案会很有帮助。

Answer 1

<table id="mytable">
    <tbody>
        <tr><td>Foo</td><td>Bar</td></tr>
        <tr><td>Bork</td><td>Bork</td></tr>

    </tbody>
</table>

<script type="text/javascript">

$$('#mytable tr').each(function(item) {
    item.observe('mouseover', function() {
        item.setStyle({ backgroundColor: '#ddd' });
    });
    item.observe('mouseout', function() {
        item.setStyle({backgroundColor: '#fff' });
    });
});
</script>