• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Cannot set property 'innerHTML' of null

0 głosów
1,633 wizyt
pytanie zadane 21 marca 2017 w JavaScript, jQuery, AJAX przez Seabool Nowicjusz (150 p.)

Witam.

Robię zadania z JavaScript'u i mam taki mały problem, nie wiem czy coś przeoczyłem, ale w konsoli dostaję błąd po kliknięciu na przycisk "Sprawdź" podany w temacie (Uncaught TypeError: Cannot set property 'innerHTML' of null). Przenoszenie skryptu na koniec body nie pomogło.

Kod:

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8"/>
	<title></title>
	<script type="text/javascript">
		//Napisać program, który dla trzech wczytanych liczb całkowitych odpowiada, czy mogą być one długościami boków trójkąta (a) prostokątnego, (b) równoramiennego, (c) równobocznego.
		function sortuj(d){
			var x=0;
			n = d.length;
			for(j = 0; j < n - 1; j++){
				for(i = 0; i < n - 1; i++){
					if(d[i] > d[i + 1])
					{
						x = d[i];
						d[i] = d[i + 1];
						d[i + 1] = x;
					}
				}
			}
		}
		function wypisz(d){
			for(var i=0;i<d.length;i++){
				document.write(d[i] + "<br/>");
				d[i] = parseInt(d[i]);
			}
		}
		function sprPrst(d){
			if((d[0] + d[1]) > d[2] && (d[1] + d[2]) > d[0] && (d[0] + d[2]) > d[1])
				document.getElementById("test1").innerHTML = "TAK";
			else
				document.getElementById("test1").innerHTML = "NIE";
		}
		function sprRwnRam(d){
			if(d[0] ==d[1]||d[1] ==d[2]||d[2] ==d[0])
				document.getElementById("test2").innerHTML = "TAK";
			else
				document.getElementById("test2").innerHTML = "TAK";
		}
		function sprRwnBocz(d){
			if(d[0] == d[1] && d[1] == d[2])
				document.getElementById("test3").innerHTML = "TAK";
			else
				document.getElementById("test3").innerHTML = "NIE";
		}
		function sprawdz(){
			var tab = new Array();
			tab[0] = document.getElementById("l1").value;
			tab[1] = document.getElementById("l2").value;
			tab[2] = document.getElementById("l3").value;
			sortuj(tab);
			wypisz(tab);
			sprPrst(tab);
			sprRwnRam(tab);
			sprRwnBocz(tab);
		}
	</script>
</head>
<body>
	<input type="text" id="l1"/>
	<input type="text" id="l2"/>
	<input type="text" id="l3"/>
	<input type="submit" value="Sprawdź" onclick="sprawdz()"/><br/>
	<b>Trójkąt prostokątny: </b><div id="test1"></div><br/>
	<b>Trójkąt równoramienny: </b><div id="test2"></div><br/>
	<b>Trójkąt równoboczny: </b><div id="test3"></div>
</body>
</html>

 

2 odpowiedzi

+1 głos
odpowiedź 21 marca 2017 przez Fenix Nałogowiec (26,950 p.)
wybrane 22 marca 2017 przez Seabool
 
Najlepsza

Błąd jest dlatego że nie ma w tym momencie tych divów, a dzieje sie tak z powodu: 

  for(var i=0;i<d.length;i++){
                document.write(d[i] + "<br/>");
                d[i] = parseInt(d[i]);
            }

wiecej chyba nie musze dodawac?

komentarz 22 marca 2017 przez Seabool Nowicjusz (150 p.)
Dzięki :) Zrobiłem tą funkcję do testów i zapomniałem o niej.
–1 głos
odpowiedź 21 marca 2017 przez arek01996 Stary wyjadacz (12,150 p.)
Wykonaj cały kod js w wydarzeniu window.onload;
komentarz 21 marca 2017 przez Seabool Nowicjusz (150 p.)

Jeżeli wykonuję cały kod skryptu w window.onload to wtedy otrzymuję błąd, że funkcja sprawdz() nie jest zdefiniowana w onclick.

komentarz 21 marca 2017 przez arek01996 Stary wyjadacz (12,150 p.)

Twój błąd wynika z tego że w momencie użycia skryptu divy jeszcze nie istnieją.

Dlatego użyj zdarzenia, onload np:

document.addEventListener("load", function(){
    document.getElementById("demo").innerHTML = "Hello World";
});

 

1
komentarz 21 marca 2017 przez Fenix Nałogowiec (26,950 p.)
Przyczyną jest kolejność wykonywania funkcji,  i zadań które spełniają. Wypisz nadpisuje body, nie zachowując wcześniejszej struktury. Wiec div'y w momencie odpalenia spr~nie istnieją.
komentarz 22 marca 2017 przez arek01996 Stary wyjadacz (12,150 p.)
A no tak racja

Podobne pytania

0 głosów
0 odpowiedzi 200 wizyt
0 głosów
1 odpowiedź 84 wizyt
0 głosów
1 odpowiedź 329 wizyt
pytanie zadane 2 kwietnia 2017 w HTML i CSS przez Satpol Początkujący (310 p.)
Porady nie od parady
Odznacz odpowiedź zieloną fajką, jeśli uważasz, że jest ona najlepsza ze wszystkich i umożliwiła ci rozwiązanie problemu.Najlepsza odpowiedź

65,805 zapytań

112,454 odpowiedzi

237,603 komentarzy

46,734 pasjonatów

Przeglądających: 239
Pasjonatów: 20 Gości: 219

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...