Сообщение от darl
|
Доброе время суток.
Не могу понять как лучше реализовать идею.
имеется таблица
<table id="table">
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</table>
и CSS
#table tr:hover{
background:red;
}
Здесь у меня реализовано изменение цвета ряда у таблицы по наведению, здесь все обходится без JS.
Я хочу реализовать выделение еще столбца, здесь уже нужен JS,
Только не пойму как, можно конечно вешать на каждую ячейку class, но ИМХО это будет прожорливо, т.к. таблицы у меня будут большими.
Подскажите советом как будет эффективней
|
<style type="text/css">
.attention {background:#999}
</style>
<table id="table">
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
</table>
<script type="text/javascript">
var tr_list = document.getElementById('table').getElementsByTagName('tr');
for(var i=0; i<tr_list.length; i++){
tr_list[i].getElementsByTagName('td')[1].className='attention';
}
</script>