Gostaria de saber como encontrar um determinado elemento <tr>
em uma tabela numerada. Por exemplo: Numa tabela em que cada linha <tr>
tem suas células <td>
numeradas de 1-5, contendo 4 linhas <tr>
, se passo o número 15, tenho como resultado a 3ª linha <tr>
, se passo o número 17, tenho como resultado a 4ª linha <tr>
, e assim por diante.
Com table.match(/<tr>/g)
, obtenho todos os 4 elementos <tr>
, mas o que eu quero é obter apenas um elemento <tr>
, como resultado final, de acordo com o critério numérico explicado acima.
O objetivo é aplicar um estilo na tag <tr>
, um contorno, outline: solid 1px red;
, para dar destaque.
var table = ['<table>
<tr>
<td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
</tr>
<tr>
<td>6</td><td>7</td><td>8</td><td>9</td><td>10</td>
</tr>
<tr>
<td>11</td><td>12</td><td>13</td><td>14</td><td>15</td>
</tr>
<tr>
<td>16</td><td>17</td><td>18</td><td>19</td><td>20</td>
</tr>
</table>'];
table.match(/<tr>/g); // Me devolve todos os elementos <tr>
A tabela é originalmente a função abaixo que gera um Calendário. Já consegui destacar o dia atual. Agora o desafio é fazer o mesmo com a semana atual:
function Calendar(id, year, month) {
var elem = document.getElementById(id)
var mon = month - 1
var d = new Date(year, mon)
var e = new Date();
var weekDay = ["Sun", "Mon", "Tues", "Wed", "Thu", "Fri", "Sat"];
var months = ['January', 'Frebruary', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
var table = ['<table><tr>']
table.push('<th colspan = 4>' + months[mon] + '</th>' + '<th colspan = 3>' + year + '</th>' + '</tr><tr>')
for (var i = 0; i <= 6; i++ ) {
table.push('<th>' + weekDay[i] + '</th>')
}
table.push('</tr><tr>')
for (var i=0; i<d.getDay(); i++) {
table.push('<td></td>')
}
while(d.getMonth() == mon) {
if (d.getDate() == e.getDate()) { // Condicional para dar destaque ao dia atual
table.push('<td class=day>'+d.getDate()+'</td>')
} else {
table.push('<td>'+d.getDate()+'</td>')
}
if (d.getDay() % 7 == 6) {
table.push('</tr><tr>')
}
d.setDate(d.getDate()+1)
}
for (var i=d.getDay(); i<7; i++) {
table.push('<td></td>')
}
table.push('</tr></table>')
elem.innerHTML = table.join('\n')
}
new Calendar("cal", 2015, 3);