Como descobrir a quantidade de tr que há numa tabela

Preciso de ajuda na solução de um problema.

Tenho uma tabela que tem uma linha de cada cor. Tenho um botão para adicionar uma nova linha. Contudo, a cor de uma linha não pode ser a mesma da linha seguinte:

Exemplo:

cinza, azul, cinza, azul… tenho que fazer nessa ordem

Comecei a aprender javascript, só que não consigo acertar minha lógica.

// Defini que tab são todas tr
// Se o resto de tab é igual a zero então
// tr recebe essa cor

var linha = null;
var tab = document.getElementsByTagName("tr");

function xpto() {
	if (tab.length % 2 == 0) {
		tab.style.backgroundColor="#E6E6E6";
		
		if(linha == null) {
			var linha1 = document.getElementById("tabela").insertRow (-1);
			linha1.insertCell(0).innerHTML = document.getElementById("oT").value;
			linha1.insertCell(1).innerHTML = document.getElementById("tColeta").value;
			linha1.insertCell(2).innerHTML = document.getElementById("tEntrega").value;
			linha1.insertCell(3).innerHTML = document.getElementById("pEntrega").value;
			linha1.insertCell(4).innerHTML = document.getElementById("trans").value;
			linha1.insertCell(5).innerHTML = document.getElementById("mod").value;
		} else {
			linha.cells[0].innerHTML = document.getElementById("oT").value;
			linha.cells[1].innerHTML = document.getElementById("tColeta").value;
			linha.cells[2].innerHTML = document.getElementById("tEntrega").value;
			linha.cells[3].innerHTML = document.getElementById("pEntrega").value;
			linha.cells[4].innerHTML = document.getElementById("trans").value;
			linha.cells[5].innerHTML = document.getElementById("mod").value;
		}
	} else {
		tab.style.backgroundColor="#EEEEEE";
		
		if(linha == null) {
			var linha1 = document.getElementById("tabela").insertRow (-1);
			linha1.insertCell(0).innerHTML = document.getElementById("oT").value;
			linha1.insertCell(1).innerHTML = document.getElementById("tColeta").value;
			linha1.insertCell(2).innerHTML = document.getElementById("tEntrega").value;
			linha1.insertCell(3).innerHTML = document.getElementById("pEntrega").value;
			linha1.insertCell(4).innerHTML = document.getElementById("trans").value;
			linha1.insertCell(5).innerHTML = document.getElementById("mod").value;
		} else {
			linha.cells[0].innerHTML = document.getElementById("oT").value;
			linha.cells[1].innerHTML = document.getElementById("tColeta").value;
			linha.cells[2].innerHTML = document.getElementById("tEntrega").value;
			linha.cells[3].innerHTML = document.getElementById("pEntrega").value;
			linha.cells[4].innerHTML = document.getElementById("trans").value;
			linha.cells[5].innerHTML = document.getElementById("mod").value;
		}
	}
	
	linha = null;
	mostrarTabela();
}
1 curtida

$("#idTabela > tbody > tr").length

1 curtida

document.querySelectorAll('#idtabela tr').length

3 curtidas

mas parece que o querySelector não funciona em todos os browsers

Olá VeteranoKuno, tudo certo?

Nesse caso você poderia usar os seguintes códigos como os outros integrantes acima falaram:

#####Em jQuery:

$(‘tabela tr’).length
$(’#tabela tr’).length
$(’.tabela tr’).length

#####Em JavaScript:

Acho que assim já irá funcionar.