Как бы вы написали альтернативную функцию строки, используя модуль в CoffeeScript?
-
26-09-2019 - |
Вопрос
У меня есть пример здесь типичного куска JavaScript (код, который применил бы класс фонового стиля на чередующуюся нечетную или даже строку в таблице). Я пытаюсь переписать это в CoffeeScript в моей попытке узнать это. Синтаксис диапазона CoffeeScript отличается и больше Ruby-espe. Я бы очень ценил пример того, как вы это сделаете?
function alternate(id){
if(document.getElementsByTagName){
var table = document.getElementById(id);
var rows = table.getElementsByTagName("tr");
for(i = 0; i < rows.length; i++){
//manipulate rows
if(i % 2 == 0){
rows[i].className = "even";
}else{
rows[i].className = "odd";
}
}
}
}
Обновлять
Я использую jQuery и попробовать это, но это не работает (это все строки #efefef):
$(document).ready ->
rowCount = $('tbody tr')
for row in rowCount
if row.length % 2 == 0
$('tbody tr').css('background-color', '#363636')
else
$('tbody tr').css('background-color', '#efefef')
Решение
Немного больше лаконично:
for row, i in $('tbody tr')
color = if i % 2 is 0 then '#363636' else '#efefef'
$(row).css 'background-color', color
Другие советы
Вы также можете быть заинтересованы в четные / нечетные мета селекторы, предоставленные jQuery
$('tbody tr:even').css 'background-color', '#363636'
$('tbody tr:odd').css 'background-color', '#efefef'
Если ваша конечная цель - просто применить другой стиль до нечетных / четных рядов, вы можете попробовать это:
// CSS file
#myTable tr:nth-child(even) { background-color: #363636; }
#myTable tr:nth-child(odd) { background-color: #efefef; }
Нет JS здесь, просто обычные CSS, которые хороши, поскольку укладки - это проблема презентации.
Однако он работает только в (относительно) современных браузерах: то есть 9+, Firefox 4+, Chrome ...
Пытаться for row, i in rows
, куда i
Удерживает счетчик петли.