Sumowanie komórek w wierszu

0

Witam. W moim dokumencie HTML znajdują się funkcje f(), która ma za zadanie wypisać rosnąco liczby od 0 do n (w zależności ile jest komórek) do każdej komórki oraz Suma(), która powinna w każdym wierszu OSOBNO sumować jej komórki. Problem w tym ze funkcja ta sumuje wszystko na raz, a wynik wpisuje do pierwszego <th>. Mój kod

<html lang="pl">
	<head>
		<meta charset= "utf-8">
		<title> Ćwiczenie 5 </title>
		<style>
				td {width:40px; height:40px ; border: 1px solid grey;}
				table {border-collapse:collapse}
				tr:nth-child(odd) td:nth-child(odd) {background:#ddd}
				tr:nth-child(even) td:nth-child(even) {background:#ddd}
				th {width:40px; height:40px; border:1px solid gray;}
				tr {width:40px; height:40px; border:1px solid gray;}

		</style>
			
	</head>
	<body>
			
		<table class="tabela">
		<tr><th></th><td></td><td></td><td></td><td></td><td></td></tr>
		<tr><th></th><td></td><td></td><td></td><td></td><td></td></tr>
		<tr><th></th><td></td><td></td><td></td><td></td><td></td></tr>
		<tr><th></th><td></td><td></td><td></td><td></td><td></td></tr>
		<tr><th></th><td></td><td></td><td></td><td></td><td></td></tr>
        </table>
		<button onclick="f()">Liczby</button>
		<button onclick="Suma()">Suma wierszu</button>
		
    </body>

    <script>
    
    function f()
				{
					var tabela= document.getElementsByTagName("td");
					liczba = 0;
					for (let i=0; i <= tabela.length ; i++)
					{
						tabela[i].innerHTML = i;
					}
					
				}
    
    
    
    
    function Suma()
				{
					var wiersz1 = document.querySelectorAll('tr');
					var komorka4 = document.querySelectorAll('td');
					var th1 = document.querySelectorAll('th')
					var wynik = 0;
					
					for (let i =0 ; i<=wiersz1.length; i++)
					{
						for(let j=0; j<=komorka4.length;j++)
						{
							var liczba2 = parseInt(komorka4[j].innerHTML);
							wynik += liczba2;
							th1[i].innerHTML = wynik;
							
						}
						
					}
				}
    
    
    
    
    </script>
</html>
1

Włącz sobie w przeglądarce konsolę (developer tools), będziesz widział jakie błędy wywala.

Problem w tym ze funkcja ta sumuje wszystko na raz

Przenieś var wynik = 0; do pierwszej pętli for - każda pętla ma obliczać nową sumę.
Następny problem jest taki, że zawsze sumujesz wszystkie komórki - trzeba określić jakie komorka4[j] powinny być sumowane - jaki powinien być zakres j dla danego wiersza. Pewnie prościej byłoby po prostu wyciągnąć potrzebne komórki z wiersza.

a wynik wpisuje do pierwszego

Bo wychodzisz poza zakres i wtedy funkcja przestaje działać. Na przykład jeżeli mamy:
for(let j=0; j<=tab.length;j++){ }
a w tablicy są dwa elementy (tab.length jest równe 2), wnętrze pętli będzie wykonywane dla i=0, 1, 2. Taki problem jest ze wszystkim pętlami for w tym kodzie - zacznij od naprawienia warunków pętli i zobacz co się stanie.

0

Dodaje dla potomnych rozwiązanie problemu ;)

function Suma()
				{
					var wiersz1 = document.querySelectorAll('tr');
					var komorka4 = document.querySelectorAll('td');
					var th1 = document.querySelectorAll('th')
					var wynik = 0;
					for(let x=0;x<wiersz1.length;x++)
					{
						wynik=0;
						for(let y=((komorka4.length/5)*x);y<((komorka4.length/5)*(x+1));y++)
						{
							wynik += parseInt(komorka4[y].innerHTML);
						}
						wiersz1[x].firstElementChild.innerHTML = wynik;
					}
				}
0

W jaki sposób mogę "wyciągnąć potrzebne komórki z wiersza"?

function Suma() {
    const table = document.getElementsByTagName("table")[0];
    for (let row of table.rows) {
        let rowSum = 0;
        for (let c = 1; c < row.cells.length; c++) {
            rowSum += parseInt(row.cells[c].innerHTML);
        }
        row.cells[0].innerHTML = rowSum;
    }
}

https://www.w3schools.com/jsref/dom_obj_table.asp ;)

1 użytkowników online, w tym zalogowanych: 0, gości: 1