# Java Script, Problem beim staten



## Developer_X (17. Dez 2009)

Hi, ich habe Probleme Dabei überhaupt ganz einfach eine datei zu starten.
Ich schäme mich ja so, sitze schon seit stunden dran und find einfach nichts.

JS und HTML sind im gleichen Abteil

Main.html

```
<html>        
	<head>        
		<title>       
			X-Games       
		</title>       
		<script type="text/javascript" src="Funktions.js"></script> 
	</head>  
	<body onload="start()">          
		<div id="objekt_01"><h1>       
			X-Games       
		</h1></div>       
	</body>       
</html>
```

Funktions.js

```
// Component Vars       
var component_01;       
       
var x = -100;       
var y = 0;       
       
var width = 0;       
var height = 0;       
       
// Window Frames       
function alert(var text)       
{       
     window.alert(text);        
}       
function getText(var text)       
{       
     return window.confirm(text);       
}       
     
//  Load     
function load()    
{    
	component_01 = document.getElementById("objekt_01");    
}    
//	Start   
function start()   
{   
	load();
	move_01();
}   
   
//	Move Objekts   
function move_01()   
{   
	var ziel_X = screen.width/2;   
	if(x<ziel_X)   
	{   
		x+=10;   
		component_01.style.left=x;   
		component_01.style.top=20;   
		window.setTime('move_01()',20);   
	}   
}
```
Was zum Teufel mache ich falsch?
Das sich gar nichts regt.


----------



## ARadauer (17. Dez 2009)

was tust du dir da an?
JavaScript ist weit nicht so gnädig wie Java! Besorg dir ermal Firebug für Firefox.

Einen Haufen Code abtippen und dann versuchen das zu fixen kannst du gleich vergessen.  Schritt für Schritt.


```
// Window Frames       
function alert(var text)       
{       
     window.alert(text);        
}
```
raus damit!

component_01.style.left=x;   
Bist du dir sicher das das IE so kann?

vor und nach x+=10;   mal ein alert rein, damit du siehst wie weit du kommst...


----------



## Developer_X (17. Dez 2009)

In meinem JavaScript Buch stand, das ginge so.
Und ich wollte den Code nicht abtippen, sondern habe ihn vertieft, und verglichen, war alles richtig, funktioniert aber leider nicht.


----------



## Developer_X (17. Dez 2009)

ich habe den Code mal geändert, von der JS Datei, aber klappt immer noch nicht:

```
// Component Vars                    
var x = -100;            
var y = 0;            
            
var width = 0;            
var height = 0;            
            
//	Start        
function start()        
{        
	move_01();     
}        
        
//	Move Objekts        
function move_01()        
{        
	var ziel_X = screen.width/2;        
	if(x<ziel_X)        
	{        
		x=x+10;       
		document.getElementById("objekt_01").style.left=x;        
		document.getElementById("objekt_01").style.top=20;        
		window.setTime('move_01()',20);        
	}        
}
```

Ich hab auch window.alert methoden eingebaut, aber nicht eine einzige ging an, noch nicht einmal wenn ich sie vor move_01() setzte.
Was soll ich tun verdammt?

außerdem die JSKlasse document enthält unter anderem die Methoden getElementById (nach meinem Buche) das aber schon ein paar Jährchen auf dem Buckel hat.
Gibts die etwa nicht mehr?
Liegt es daran?


----------



## faetzminator (18. Dez 2009)

Nun, js ist noch jung, und wenn dein Buch nicht gerade das neuste ist... da hab ich wirklich schon Müll gesehen. Btw, wenn du JS programmierst, solltest du dir JQuery anschauen


----------



## ARadauer (18. Dez 2009)

> Ich hab auch window.alert methoden eingebaut, aber nicht eine einzige ging an, noch nicht einmal wenn ich sie vor move_01() setzte.
> Was soll ich tun verdammt?


ich seh in deinem code keine alerts..

wird die move_01 methode überhaupt aufgerufen?

Ist das Buch älter als 3-4 Jahre... wirf es in den Müll...


----------



## ARadauer (18. Dez 2009)

heißt es nicht setTimeout?
ich seh schon.. ich werds mir genauer anshen müssen und das bei mir lokal versuchen...


```
// Component Vars       
var component_01;       
       
var x = -100;       
var y = 0;       
       
var width = 0;       
var height = 0;       
       
 
     
//  Load     
function load()    
{    
	component_01 = document.getElementById("objekt_01");    
}    
//	Start   
function start(){
	load();
	move_01();
}   
   
//	Move Objekts   
function move_01()   	
{   
	
	var ziel_X = screen.width/2;   
	if(x<ziel_X)   
	{   		
		x+=20;   	
		component_01.style.left=x;   
		component_01.style.top=20;   		
		window.setTimeout('move_01()',20);   
		}
}
```

natürlich musst du dein element absolute postionieren...

```
<html>        
	<head>        
		<title>       
			X-Games       
		</title>       
		<script type="text/javascript" src="Functions.js"></script> 
	</head>  
	<body onload="start()">          
		<div id="objekt_01" style="position:absolute"><h1>       
			X-Games       
		</h1></div>       
	</body>       
</html>
```


----------



## Developer_X (19. Dez 2009)

geht immer noch nicht


----------



## Spacerat (20. Dez 2009)

Dein Script wird ja auch schon in der Funktion [c]start()[/c] durch einen Fehler beendet. Der Fehler wird dir von [c]document.getElemenByID("egalWas")[/c] gesponsored, denn während [c]BODY.onLoad()[/c] gibt es die Objekte innerhalb dieses Tags (bei dir [c]objekt_01[/c]) noch nicht.


----------



## Tomate_Salat (3. Jan 2010)

Spacerat hat gesagt.:


> Dein Script wird ja auch schon in der Funktion [c]start()[/c] durch einen Fehler beendet. Der Fehler wird dir von [c]document.getElemenByID("egalWas")[/c] gesponsored, denn während [c]BODY.onLoad()[/c] gibt es die Objekte innerhalb dieses Tags (bei dir [c]objekt_01[/c]) noch nicht.



ähm NEIN. onLoad wird ausgeführt wenn der body geladen wurde => die Objekte sind also vorhanden

€: Wenn ich js entwickle und etwas nicht funktioniert, gehe ich den code mittels alert(); an "gefährlichen" Stellen durch. Wird das alert(); ausgeführt, wurde auch der code davor behandelt. Wird der code nicht ausgeführt, haste den Fehler schonmal eingegrenzt


----------



## faetzminator (3. Jan 2010)

Verwendet ihr alle keinen Firefox? Da gibt es wunderbare Add-ons wie Firebug etc.


----------



## Spacerat (3. Jan 2010)

> ähm NEIN. onLoad wird ausgeführt wenn der body geladen wurde => die Objekte sind also vorhanden


...und das kann man wo nachlesen? Ich hatte schon oft genug Probleme dieser Art, hauptsachlich bei Tags die verzögert vervollständigt werden (z.B. "IMG"). Ich hab' dann eifach statt [c]onload="funktion()"[/c] im Body als letzte Zeile im Script [c]setTimeout("funktion()", 500);[/c] geschrieben, wobei der Timeout-Wert immer ein Testwert darstellte.
@Edit: Ich verwende Venkman in FF und Taste F12 im IE8. Weis nicht, ob das im IE8 grundsätzlich funktioniert oder ein AddOn ist. Zumindest startet man so die IE-Entwicklertools.


----------



## faetzminator (3. Jan 2010)

Das onload-Problem lässt sich ebenfalls ganz einfach mit JQuery lösen


----------



## Noctarius (3. Jan 2010)

Wie faetzminator schon sagt, das Problem lässt sich durch mehrere JS-Frameworks, allen voran JQuery lösen. Diese haben nciht umsonst eine Funktion die darauf wartet, dass das Dokument "ready" ist. Bei onLoad im Body muss das Dokument eben noch nicht vollständig geladen sein, es bedeutet nur, dass der DOM fertig geladen wurde. Externe Bilder, JavaScript-Dateien und sonstige gelinkte Files müssen zu diesem Zeitpunkt noch nicht zur Verfügung stehen.


----------



## Tomate_Salat (4. Jan 2010)

Noctarius hat gesagt.:


> Externe Bilder, JavaScript-Dateien und sonstige gelinkte Files müssen zu diesem Zeitpunkt noch nicht zur Verfügung stehen.



Das kann natürlich sein. Da ich aber seltenst gelinkte Objekte benutze, komme ich mit der onload-funktion bisher gut aus. Benutzt man verlinkte Objekte, dürfte es aber auch keine schwierigkeit sein, diese zu überprüfen bevor man den code ausführt. Natürlich helfen hier Frameworks wie jQuery weiter und sind gerade für Anfänger der beste Weg seine Seite auf allen Browsern lauffähig zu bekommen. 
Trotzdem sollte man das Thema hier nicht mittels "nimm jQuery" abhaken, da (so wie ich denke) vom TO ein gewisses Interesse vorhanden ist, JS zu lernen.



faetzminator hat gesagt.:


> Verwendet ihr alle keinen Firefox? Da gibt es wunderbare Add-ons wie Firebug etc.


ich verwende ausschließlich Firefox, habe hier zwar noch andere x-tausend browser drauf aber nur um die Seite testen zu können. Mein Vorschlag war nur ein alternativer zu Entwicklertools, da Firebug ja schon genannt wurde ;-)


----------



## Noctarius (4. Jan 2010)

Tomate_Salat hat gesagt.:


> ... da (so wie ich denke) vom TO ein gewisses Interesse vorhanden ist, JS zu lernen ...



Das bestreite ich, die Anderen wissen schon warum


----------



## Tomate_Salat (4. Jan 2010)

könnte aber andere geben die ein ähnliches Problem haben und für die wäre es sicher gut eine löusng zu finden ;-)


----------



## faetzminator (4. Jan 2010)

Warum sollte JQuery zu verwenden keine Lösung sein? Ich würde sogar sagen, dass es _die_ Lösung ist.
Wenn jemand mit [c]System.out[/c] manuell loggen will (natürlich in Java), ist dann auch "verwende log4j" eine doofe Antwort?


----------



## Spacerat (4. Jan 2010)

Eine "Lösung", wenn auch eine nicht ganz so saubere jedoch ohne JQuery steht auch schon da... [c]setTimeout()[/c]. Nun muss nur noch gewartet werden, ob DX damit zufrieden ist.


----------



## Tomate_Salat (4. Jan 2010)

jQuery ist für mich eine reine Alternative. Das Ergebnis zählt, aber für mich ist manchmal der weg dahin wichtiger und ich würde gerne wissen wie es funktioniert, deswegen wäre für mich jQuery hier keine antwort.


und btw:

```
<html>        
	<head>        
		<title>       
			X-Games       
		</title>       
		<script type="text/javascript">
			// Component Vars       
			var component_01;       
       
			var x = -100;       
			var y = 0;       
       
			var width = 0;       
			var height = 0;       
       
 
     
			//  Load     
			function load()    
			{    
				component_01 = document.getElementById("objekt_01");    
			}    
			//	Start   
			function start(){
				load();
				move_01();
			}   
   
			//	Move Objekts   
			function move_01()   	
			{   
		
			var ziel_X = screen.width/2;   
				if(x<ziel_X)   
				{   		
					x+=20;   	
					component_01.style.left=x;   
					component_01.style.top=20;   		
					window.setTimeout('move_01()',20);   
				}
			}
			
		</script> 
	</head>  
	<body onload="start()">          
		<div id="objekt_01" style="position:absolute"><h1>       
			X-Games       
		</h1></div>       
	</body>       
</html>
```

funktioniert doch (sogar mit IE8)


----------



## faetzminator (4. Jan 2010)

Tomate_Salat hat gesagt.:


> jQuery ist für mich eine reine Alternative.



Ich finde es schön, wie viele Zeilen Code man sich sparen kann mit JQuery. Auch die ganzen CSS3 Selektoren funktionieren ohne Probleme  Es ist einfach zu verwenden, schön und erst noch relativ schlank, finde ich eine tolle Sache. Aber das ist nunmal Ansichtssache


----------



## Spacerat (4. Jan 2010)

Klar. Aber warum funktioniert es so und nicht wie es DX haben will? Die Problematiken:
1. Die Script-Ressource wird nicht gefunden.
2. Die Script-Ressource wird zwar gefunden, ist aber zum Zeitpunkt von Body.OnLoad() noch nicht vollständig geladen.
3. Objekt mit ID "object_01" wird gerade noch instanziert, während "start()" bereits aufgerufen wurde. onLoad triggert aus unerfindlichen Gründen zu früh. Hier aber sehr unwahrscheinlich.


----------



## Tomate_Salat (4. Jan 2010)

faetzminator hat gesagt.:


> Ich finde es schön, wie viele Zeilen Code man sich sparen kann mit JQuery. Auch die ganzen CSS3 Selektoren funktionieren ohne Probleme  Es ist einfach zu verwenden, schön und erst noch relativ schlank, finde ich eine tolle Sache. Aber das ist nunmal Ansichtssache



Das bezweifelt ja auch keiner (nicht mal ich ). Mir geht es aber darum sich mit der Materie auseinanderzusetzen und ein FW welches dir alles abnimmt was mit Denken zu tun hat, hilft dir nicht dabei diese Materie kennen zu lernen.



Spacerat hat gesagt.:


> Klar. Aber warum funktioniert es so und nicht wie es DX haben will? Die Problematiken:
> 1. Die Script-Ressource wird nicht gefunden.
> 2. Die Script-Ressource wird zwar gefunden, ist aber zum Zeitpunkt von Body.OnLoad() noch nicht vollständig geladen.
> 3. Objekt mit ID "object_01" wird gerade noch instanziert, während "start()" bereits aufgerufen wurde. onLoad triggert aus unerfindlichen Gründen zu früh. Hier aber sehr unwahrscheinlich.



Dann spricht er vllt einfach eine falsche datei an, auch wenn ichs auslagere funktionierts:

die html:

```
<html>        
	<head>        
		<title>       
			X-Games       
		</title>       
		<script type="text/javascript" src="test.js"></script>
	</head>  
	<body onload="start()">          
		<div id="objekt_01" style="position:absolute"><h1>       
			X-Games       
		</h1></div>       
	</body>       
</html>
```

die test.js

```
// Component Vars       
			var component_01;       
       
			var x = -100;       
			var y = 0;       
       
			var width = 0;       
			var height = 0;       
       
 
     
			//  Load     
			function load()    
			{    
				component_01 = document.getElementById("objekt_01");    
			}    
			//	Start   
			function start(){
				load();
				move_01();
			}   
   
			//	Move Objekts   
			function move_01()   	
			{   
		
			var ziel_X = screen.width/2;   
				if(x<ziel_X)   
				{   		
					x+=20;   	
					component_01.style.left=x;   
					component_01.style.top=20;   		
					window.setTimeout('move_01()',20);   
				}
			}
```

Das einzige was ich von deinen Punkten somit bestätigen kann ist Punkt 1)! Denn bei mir funktioniert das Script ohne Probleme und auch sonst hatte ich nie iwelche Problematiken mit dem onLoad, also lass doch mal die arme Funktion in frieden ;-) .


----------

