Funktion automatisch ausführen ohne onLoad – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 19:24:56 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371540#m1371540 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371540#m1371540 <p>Guten Abend Community,</p> <p>ich bin jez schon die ganze Zeit am überlegen, wie ich eine Javascript-Funktion automatisch aufrufe (also direkt, wenn die Seite mit dem Script geöffnet wird).</p> <p>Ich hatte diese Frage hier schonmal gestellt und die wurde auch super benatwortet. Leider habe ich die Lösung nach längerer Zeit wieder vergessen und das von mir erstellte Thema habe ich auch nicht wieder gefunden.</p> <p>Das ganze hatte etwas mit der Funktion <code class="language-javascript">setTimeout</code> zu tun, soweit ich mich erinnern kann.</p> <p>Wäre nett, wenn mir da nochmal jemand helfen kann. Danke  =)</p> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 19:30:12 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371542#m1371542 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371542#m1371542 <p>Grüße,</p> <pre><code class="block language-javascript"><span class="token keyword">function</span> <span class="token function">bla</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token punctuation">}</span> <span class="token function">bla</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre> <p>MFG<br> bleicher</p> <div class="signature">-- <br> __________________________-<br> <a href="http://double.iblogger.org/" rel="nofollow noopener noreferrer">Die Essenz der Egomanie</a><br> <img src="http://img296.imageshack.us/img296/9641/minibannerso7.jpg" alt="" loading="lazy"><br> <a href="http://www.peter.in-berlin.de/projekte/selfcode/?code=ie%3A%7B+fl%3A%28+br%3A%3C+va%3A%7C+ls%3A%5B+fo%3A%23+rl%3A%3F+n4%3A%3F+ss%3A%7C+de%3A%3E+js%3A%7C+ch%3A%7C+sh%3A%28+mo%3A%7C+zu%3A%7C" rel="nofollow noopener noreferrer">ie:{ fl:( br:< va:| ls:[ fo:# rl:? n4:? ss:| de:> js:| ch:| sh:( mo:| zu:|</a> </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 17:46:20 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371541#m1371541 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371541#m1371541 <p>hi,</p> <blockquote> <p>ich bin jez schon die ganze Zeit am überlegen, wie ich eine Javascript-Funktion automatisch aufrufe (also direkt, wenn die Seite mit dem Script geöffnet wird).</p> </blockquote> <p>Notiere an geeigneter Stelle, z.B. im Header:</p> <p><script type="text/javascript"><br>   meineFunktion();<br> </script></p> <p>und die Funktion "meineFunktion();" wird beim Laden der Seite in einem Browser, der JS unterstützt, ausgeführt, sofern es die Funktion auch gibt.</p> <p>Ein besserer Stil finde ich, ists jedoch, dafür das OnLoad-Event zu nutzen, allein schon, wegen der Übersicht.</p> <p>Hotte</p> <div class="signature">-- <br> Wenn der Kommentar nicht zum Code passt, kann auch der Code falsch sein. </div> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 19:37:40 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371543#m1371543 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371543#m1371543 <blockquote> <p>Grüße,</p> <pre><code class="block language-javascript"></code></pre> </blockquote> <p>function bla(){</p> <blockquote> <p>}<br> bla();</p> </blockquote> <pre><code class="block"> > > MFG > bleicher >\_< wtf ....Danke. </code></pre> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 19:44:07 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371544#m1371544 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371544#m1371544 <p>Funktioniert leider nicht Oo.</p> <pre><code class="block language-javascript"><span class="token operator"><</span>script type<span class="token operator">=</span><span class="token string">"text/javascript"</span> language<span class="token operator">=</span><span class="token string">"javascript"</span><span class="token operator">></span> <span class="token keyword">function</span> <span class="token function">setTransparency</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token comment">// Objekt holen </span> strID <span class="token operator">=</span> <span class="token string">"transparent-td-1"</span><span class="token punctuation">;</span> <span class="token keyword">var</span> myObj <span class="token operator">=</span> <span class="token punctuation">(</span><span class="token constant">IE</span><span class="token punctuation">)</span><span class="token operator">?</span>document<span class="token punctuation">.</span>all<span class="token punctuation">[</span>strID<span class="token punctuation">]</span><span class="token operator">:</span>document<span class="token punctuation">.</span><span class="token function">getElementByID</span><span class="token punctuation">(</span>strID<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">if</span><span class="token punctuation">(</span><span class="token constant">IE</span><span class="token punctuation">)</span><span class="token punctuation">{</span> intWert <span class="token operator">=</span> <span class="token number">50</span><span class="token punctuation">;</span> myObj<span class="token punctuation">.</span>style<span class="token punctuation">.</span>filter <span class="token operator">=</span> <span class="token string">"alpha(opacity="</span><span class="token operator">+</span>intWert<span class="token operator">+</span><span class="token string">")"</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token punctuation">}</span> <span class="token function">setTransparency</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token operator"><</span><span class="token operator">/</span>script<span class="token operator">></span> </code></pre> <p>Nur nach Klick auf den Button wird die Funktion aufgerufen.</p> <p><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>button<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setTransparency</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>transparenz<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span></code></p> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 22:05:34 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371548#m1371548 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371548#m1371548 <blockquote> <p>Nur nach Klick auf den Button wird die Funktion aufgerufen.</p> </blockquote> <p>Wann soll sie denn sonst ausgeführt werden?</p> <blockquote> <p><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>input</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>button<span class="token punctuation">"</span></span> <span class="token special-attr"><span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">setTransparency</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span> <span class="token attr-name">value</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>transparenz<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span></code></p> </blockquote> <p>Das Beispiel von bleicher war anders.</p> <p>Struppi.</p> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 22:39:34 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371545#m1371545 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371545#m1371545 <p>[latex]Mae  govannen![/latex]</p> <blockquote> <p>Funktioniert leider nicht Oo.</p> </blockquote> <p>Und die Fehlerkonsole meint dazu?</p> <blockquote> <pre><code class="block language-javascript"></code></pre> </blockquote> <p><script type="text/javascript" language="javascript"></p> <blockquote> <p>function setTransparency(){<br>   // Objekt holen<br>   strID = "transparent-td-1";<br>   var myObj = (IE)?document.all[strID]:document.getElementByID(strID);<br>   if(IE){<br> intWert = 50;<br>     myObj.style.filter = "alpha(opacity="+intWert+")";<br>   }<br> }<br> setTransparency();<br> </script></p> </blockquote> <pre><code class="block"> > > Nur nach Klick auf den Button wird die Funktion aufgerufen. Die Funktion dürfte hier schon direkt aufgerufen werden [und wiederholt beim Klick], allerdings vermute ich, daß beim (ersten) Direktaufruf das Element mit id="strID" noch nicht verfügbar ist und es deshalb so aussieht, als wäre sie nicht aufgerufen worden. Setze diesen Block im HTML entweder hinter das entsprechende Element oder rufe die Funktion erst bei onload auf. und in der Zeile var myObj = .....  kannst du alles hinter dem Gleichheitzeichen bis einschließlich dem Doppelpunkt ersatzlos löschen, es sei denn, du willst IE4!! beachten. Und die Methode document.getElementByID gibt es im Gegensatz zu document.getElementById nicht. Cü, Kai -- „It's 106 miles to Chicago, we got a full tank of gas, half a pack of cigarettes, it's dark, and we're wearing sunglasses“. „Hit it!“ [Selfzeugs](http://kaichen.in/selfhtml/) SelfCode: sh:( fo:| ch:? rl:( br:< n4:( ie:{ mo:| va:) js:| de:> zu:) fl:( ss:| ls:? </code></pre> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 23:04:36 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371546#m1371546 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371546#m1371546 <p>Danke für die schnelle Antwort !<br> Funktioniert ! =)</p> <blockquote> <p>Und die Fehlerkonsole meint dazu?</p> </blockquote> <p>Fehler: 'style' ist Null oder kein Objekt<br> Code: 0</p> <blockquote> <p>Die Funktion dürfte hier schon direkt aufgerufen werden [und wiederholt beim Klick], allerdings vermute ich, daß beim (ersten) Direktaufruf das Element mit id="strID" noch nicht verfügbar ist und es deshalb so aussieht, als wäre sie nicht aufgerufen worden. Setze diesen Block im HTML entweder hinter das entsprechende Element oder rufe die Funktion erst bei onload auf.</p> </blockquote> <p>Vollkommen richtig, was du sagst.<br> Ich habe den script-teil hinter das Object mit der ID gestellt und nun läuft es. Das hätte ich vielleicht auch mal in meinen ersten Beitrag mit rein schreiben sollen - sorry. Auf sowas wäre ich nie gekommen.<br> Mit onload wollte ich hier ja nicht arbeiten (siehe Thementitel), da man diesen Operator nur im body-tag nutzen kann (soweit ich das verstanden habe).</p> <blockquote> <p>und in der Zeile var myObj = .....  kannst du alles hinter dem Gleichheitzeichen bis einschließlich dem Doppelpunkt ersatzlos löschen, es sei denn, du willst IE4!! beachten. Und die Methode document.getElementByID gibt es im Gegensatz zu document.getElementById nicht.</p> </blockquote> <p>Im Grunde geht es hier eben darum, die älteren Browser anzusprechen.<br> Die Version 6 (und abwärts) des Internet Explorers stellen keine (halb-)transparenten Bilder dar.<br> Für Firefox verwende ich nun ein halb-transparentes Hintergrundbild (normales stylesheet) und für IEv6 wird das normale Bild geladen und dies dann mittels Javascript transparent gemacht (stylesheet speziell für IEv6 & die oben genannte JSFunktion).<br> Ob dies der beste Weg ist kann ich beim besten Willen nicht sagen, aber ich bin erstmal froh, dass es klappt.</p> <p>Herzlichen Dank ^_^</p> Funktion automatisch ausführen ohne onLoad Mon, 15 Jun 09 00:16:49 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371547#m1371547 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371547#m1371547 <blockquote> <p>Die Version 6 (und abwärts) des Internet Explorers stellen keine (halb-)transparenten Bilder dar.<br> Für Firefox verwende ich nun ein halb-transparentes Hintergrundbild (normales stylesheet) und für IEv6 wird das normale Bild geladen und dies dann mittels Javascript transparent gemacht (stylesheet speziell für IEv6 & die oben genannte JSFunktion).</p> </blockquote> <p>Den <a href="http://de.selfhtml.org/css/eigenschaften/filter.htm#alpha@title=alpha-Filter" rel="nofollow noopener noreferrer">http://de.selfhtml.org/css/eigenschaften/filter.htm#alpha@title=alpha-Filter</a> für den IE kannst du auch im IE-Stylesheet notieren. Eigentlich ist die Filter-Geschichte in erster Linie eine (Microsoft-eigene) CSS-Technik. Oder warum der Filter zwingend mittels JavaScript gesetzt werden? So ganz verstehe ich die Notwendigkeit des Scriptes nicht. Das ginge doch z.B. mit einer Klasse, die den Filter zugewiesen bekommt, viel einfacher.</p> <p>Es gibt aber auch komplexere Scripte, die automatisch alle eingebundenen halbtransparenten PNGs im IE mit dem AlphaImageLoader-Filter »reparieren«, z.B. <a href="http://www.dillerdesign.com/experiment/DD_belatedPNG/" rel="nofollow noopener noreferrer">http://www.dillerdesign.com/experiment/DD_belatedPNG/</a>.</p> <p>Mathias</p> <div class="signature">-- <br> <a href="http://molily.de/selfhtml-forum-js/" rel="nofollow noopener noreferrer">JavaScript-Erweiterung für das SELFHTML-Forum</a> </div> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 22:35:57 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371549#m1371549 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371549#m1371549 <blockquote> <p>Wann soll sie denn sonst ausgeführt werden?</p> </blockquote> <p>Direckt beim Aufruf der Seite und dies ohne <body onload=...</p> <blockquote> <p>Das Beispiel von bleicher war anders.</p> </blockquote> <p>Das Beispiel von bleicher funktioniert aber nicht.</p> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 22:52:59 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371550#m1371550 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371550#m1371550 <p>Hallo Battler,</p> <p>gucke mal: Wenn Du die Funktion aufrufst, ist doch noch nicht mal <body> vom Browser geparst worden. Wie also soll auf ein Element, das innerhalb vom <body> mit der ID "transparent-td-1" schlummert, überhaupt gefunden werden?</p> <p>Deiner Bedingung im Ausgang folgend, sollte folgendes zwar arbeiten:</p> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>element</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>transparent-td-1<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>element</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token script"><span class="token language-javascript"> <span class="token function">setTransparency</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span> </code></pre> <p>Mir ist aber nicht ersichtlich und auch nicht nachvollziehbar, warum onload nicht benutzt werden soll. Bitte beschreibe die Intension dahinter! Vielleicht gibt es dazu dann auch noch eine Idee, die das ganze allumfassend befriedigt.</p> <p>Gruß aus Berlin!<br> eddi</p> <div class="signature">-- <br> VEB Opel, Geruchsproben und Stasi 2.0, Zensur...<br> IHR WOLLTET MERKEL! </div> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 23:20:56 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371552#m1371552 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371552#m1371552 <p>Hey eddi,<br> danke für deine Antwort.</p> <blockquote> <p>gucke mal: Wenn Du die Funktion aufrufst, ist doch noch nicht mal <body> vom Browser geparst worden. Wie also soll auf ein Element, das innerhalb vom <body> mit der ID "transparent-td-1" schlummert, überhaupt gefunden werden?</p> <p>Deiner Bedingung im Ausgang folgend, sollte folgendes zwar arbeiten:</p> <pre><code class="block language-html"></code></pre> </blockquote> <blockquote> <p><element id="transparent-td-1"></element><br> <script type="text/javascript"><br> setTransparency();<br> </script></p> </blockquote> <pre><code class="block"> > Das was du sagst ist richtig! Das hat Kai345 auch bereits gesagt und ich habe ihm geantwortet (solltest du dir mal anschauen =). > Mir ist aber nicht ersichtlich und auch nicht nachvollziehbar, warum onload nicht benutzt werden soll. Bitte beschreibe die Intension dahinter! Vielleicht gibt es dazu dann auch noch eine Idee, die das ganze allumfassend befriedigt. »» Ich versuch das mal zu erklären: Meine Internetpräsenz ist so aufgebaut, dass verschiedene php-dateien in die index.php geladen werden, die dann die einzelen Bereiche darstellen sollen Diese section sind abhängig von einer GET-Variabel. Diese GET-Variabel änder sich je nachdem, welchen Link man anwählt (z.B. `<a href="index.php?section=media_music">Musik</a>`{:.language-html}) Das ganze ist ziemlich umfangreich gestaltet worden. Hier ein kleiner Auszug: ~~~php <?php // Inhalt der sections.php bei root/php/ $contentdata['media_pictures'] = 'content/media/pictures/index.php';  $contentdata['media_videos'] = 'content/media/videos/index.php';  $contentdata['media_music'] = 'content/media/music/index.php';  $contentdata['media_clients'] = 'content/media/clients/index.php';  $contentdata['media_other'] = 'content/media/other/index.php'; // Inhalt der index.php bei root/     if (isset($_GET['section']) AND isset($contentdata[$_GET['section']])) {      include $contentdata[$_GET['section']];     } else {      include $contentdata['news'];     }    ?> </code></pre> <p>Die index-dateien der einzelnen Sektionen enthalten in diesem Falle kein body-tag.<br> Es geht darum, dass die Funktion nur in einer bestimmten Sectionen meiner Homepage aufgerufen werden soll.<br> Und da sich der body-tag (an dem man den onload-paramtere anwendet) sich in der index.php befindet, würde die Funktion in der jeder Sektion (sei es News, Gästebuch etc...) aufgerufen werden.<br> Klar soweit ?</p> <p>Wenn es an dieser Stelle Verbesserungsvorschälge gibt, würde ich mich natürlich auch freuen =)</p> <p>greez.<br> b4ttl3m4st3r</p> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 08:48:10 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371551#m1371551 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371551#m1371551 <blockquote> <p>Mir ist aber nicht ersichtlich und auch nicht nachvollziehbar, warum onload nicht benutzt werden soll.</p> </blockquote> <p>onload feuert erst, wenn alles geladen wurde. Bilder, alle externen Dateien und das kann u.U. lange dauern, daher ist es keine schlechte Idee ein Skript vor dem onload zu starten.</p> <p>Struppi.</p> Funktion automatisch ausführen ohne onLoad Sat, 13 Jun 09 23:51:45 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371554#m1371554 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371554#m1371554 <blockquote> <p><code class="language-php"><span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token operator">...</span></span></code></p> </blockquote> <p>Das ist verständlich; okay. Du musst es nicht machen, aber vielleicht mal als kleiner Denkanstoß:</p> <pre><code class="block language-javascript"><span class="token keyword">function</span> <span class="token function">dl</span> <span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span> <span class="token keyword">var</span> f<span class="token operator">=</span><span class="token keyword">new</span> <span class="token class-name">Array</span><span class="token punctuation">(</span><span class="token string">'functionsname1'</span><span class="token string">'functionsname2'</span><span class="token string">'functionsname3'</span><span class="token string">'functionsname4'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">for</span><span class="token punctuation">(</span><span class="token keyword">var</span> i<span class="token operator">=</span><span class="token number">0</span><span class="token punctuation">;</span>i<span class="token operator"><</span>f<span class="token punctuation">.</span>length<span class="token punctuation">;</span>i<span class="token operator">++</span><span class="token punctuation">)</span> window<span class="token punctuation">[</span>f<span class="token punctuation">[</span>i<span class="token punctuation">]</span><span class="token punctuation">]</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span> <span class="token special-attr"><span class="token attr-name">onload</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value javascript language-javascript"><span class="token function">dl</span><span class="token punctuation">(</span><span class="token punctuation">)</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span></code></p> <p>Ich mag's eben gerne elegant. ;)<br> eddi</p> <div class="signature">-- <br> VEB Opel, Geruchsproben und Stasi 2.0, Zensur...<br> IHR WOLLTET MERKEL! </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 08:51:05 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371553#m1371553 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371553#m1371553 <blockquote> <p>Und da sich der body-tag (an dem man den onload-paramtere anwendet) sich in der index.php befindet, würde die Funktion in der jeder Sektion (sei es News, Gästebuch etc...) aufgerufen werden.<br> Klar soweit ?</p> <p>Wenn es an dieser Stelle Verbesserungsvorschälge gibt, würde ich mich natürlich auch freuen =)</p> </blockquote> <p>Du musst onload nicht im body Tag aufrufen, du kannst diesen Aufruf auch in einem Skriptblock anstossen.</p> <pre><code class="block language-javascript"><span class="token operator"><</span>script type<span class="token operator">=</span><span class="token string">"text/javascript"</span><span class="token operator">></span> window<span class="token punctuation">.</span><span class="token function-variable function">onload</span> <span class="token operator">=</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token operator">...</span><span class="token punctuation">.</span> <span class="token punctuation">}</span> <span class="token operator"><</span><span class="token operator">/</span>script<span class="token operator">></span> </code></pre> <p>Aber in deinem Fall ist es vermutlich sinvoller den Aufruf einfach im HTML Code hinter das Elemente zu platzieren.</p> <p>Struppi.</p> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 00:25:02 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371567#m1371567 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371567#m1371567 <blockquote> <p>»» <code class="language-php"><span class="token php language-php"><span class="token delimiter important"><?php</span> <span class="token operator">...</span></span></code></p> <p>Das ist verständlich; okay. Du musst es nicht machen, aber vielleicht mal als kleiner Denkanstoß:</p> <pre><code class="block language-javascript"></code></pre> </blockquote> <p>function dl (){</p> <blockquote> <p>var f=new Array('functionsname1''functionsname2''functionsname3''functionsname4');<br> for(var i=0;i<f.length;i++)<br> window<a href="" rel="noopener noreferrer">f[i]</a>;<br> }</p> </blockquote> <pre><code class="block"> > `<body onload="dl()">`{:.language-html} > > > Ich mag's eben gerne elegant. ;) > eddi > Ja elegant wär mir auch lieber. Ich versuch ja schon, meinen Code so sauber wie möglih zu halten und würde auf jeden Fall auch Perfektion anstreben xP. Nur leider fehlen mir bei manchen Sachen die nötigen Kenntnisse, um den wohlgewollten 'besseren Code' aufs Papier bzw. auf Adobe's Dreamweaver zu übertragern ;) Dein oben genannter Code sieht sehr interessant aus und stellt eine gute Lösung dar. Um darin allerdings die Vorzüge zu erkennen, müsste ich mich ein bisschen länger mit JavaScript beschäftigen. Ich kann deinen Ansatz nämlich überhaupt nicht mit meinem hier beschriebenen und bereits gelösten Problem in verbindung bringen, da sich hier ja nun wieder alle Funktionen (in diesem Fall 1-4) im body-tag befinden. Danke =) </code></pre> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 13:01:25 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371555#m1371555 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371555#m1371555 <blockquote> <pre><code class="block language-javascript"></code></pre> </blockquote> <p>function dl (){</p> <blockquote> <p>var f=new Array('functionsname1''functionsname2''functionsname3''functionsname4');<br> for(var i=0;i<f.length;i++)<br> window<a href="" rel="noopener noreferrer">f[i]</a>;<br> }</p> </blockquote> <pre><code class="block"> > `<body onload="dl()">`{:.language-html} > > Ich mag's eben gerne elegant. ;) OMFG, das ist alles, aber nicht elegant! Jedenfalls nicht in einer funktionalen Sprache wie JavaScript. - Keine Event-Handler-Attribute im HTML. - Keine zentrale Initialisierungsfunktion - Kein zentraler Array mit globalen Funktionsnamen Besser: - Eine [addEvent-Funktion](http://molily.de/js/einbindung.html#addevent-helfer) (oder ein Framework der Wahl) - Diese mehrfach aufrufen immer dort, wo ein Modul notiert wird function bla () {} addEvent(window, "load", bla); Modul = {    init: function () {} }; addEvent(window, "load", Modul.init); usw. Die Pflege einer zentralen Funktion fällt dann weg, auch die Funktionsnamen müssen nicht als Strings notiert werden, was den Code wartbarer macht. - Nächster Schritt: [DOMContentLoaded](http://molily.de/js/einbindung.html#domcontentloaded-crossbrowser) statt window.onload (das können alle Frameworks von Haus aus) Mathias -- [JavaScript-Erweiterung für das SELFHTML-Forum](http://molily.de/selfhtml-forum-js/) </code></pre> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 13:59:30 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371566#m1371566 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371566#m1371566 <blockquote> <p>OMFG, das ist alles, aber nicht elegant! Jedenfalls nicht in einer funktionalen Sprache wie JavaScript.</p> <ul> <li>Keine Event-Handler-Attribute im HTML.</li> <li>Keine zentrale Initialisierungsfunktion</li> <li>Kein zentraler Array mit globalen Funktionsnamen</li> </ul> <p>Besser:</p> <ul> <li>Eine <a href="http://molily.de/js/einbindung.html#addevent-helfer" rel="nofollow noopener noreferrer">addEvent-Funktion</a> (oder ein Framework der Wahl)</li> <li>Diese mehrfach aufrufen immer dort, wo ein Modul notiert wird</li> </ul> <p>function bla () {}<br> addEvent(window, "load", bla);</p> <p>Modul = {<br>    init: function () {}<br> };<br> addEvent(window, "load", Modul.init);</p> <p>[..]<br> Mathias</p> </blockquote> <p>nice ! xD<br> jetzt versteh ich noch weniger.<br> Trotzden Danke xP</p> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 15:39:45 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371557#m1371557 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371557#m1371557 <p>Hallo Mathias,</p> <blockquote> <p>OMFG, das ist alles, aber nicht elegant!</p> </blockquote> <p>was soll das? Ist das etwa nicht die Art von Umgang, die Stefan Münz, als er <a href="http://forum.de.selfhtml.org/archiv/2009/5/t186403/#m1238746" rel="nofollow noopener noreferrer">über das Forum sprach</a>, rügte?</p> <blockquote> <ul> <li>Keine Event-Handler-Attribute im HTML.</li> <li>Keine zentrale Initialisierungsfunktion</li> <li>Kein zentraler Array mit globalen Funktionsnamen</li> </ul> <p>Besser:</p> <ul> <li>Eine <a href="http://molily.de/js/einbindung.html#addevent-helfer" rel="nofollow noopener noreferrer">addEvent-Funktion</a> (oder ein Framework der Wahl)</li> <li>Diese mehrfach aufrufen immer dort, wo ein Modul notiert wird</li> </ul> </blockquote> <p><a href="https://forum.selfhtml.org/?t=187785&m=1248926" rel="noopener noreferrer">Hier</a> schriebst Du mir noch etwas von Performence und jetzt soll ich statt onload ein deine addEvent-Funktion nehmen, was dem entsprechenden Beispiel völlig abwegig gar nicht funktionieren wird, weil das Element noch gar nicht im DOM-Baum ist, oder gar ein ganzes Framework dafür verwenden?!</p> <blockquote> <p>Die Pflege einer zentralen Funktion fällt dann weg, auch die Funktionsnamen müssen nicht als Strings notiert werden, was den Code wartbarer macht.</p> </blockquote> <p>Es muss lediglich ein "zentrales" Array "gepflegt" werden -u nd nicht eine Umstantsprofessur durch eine über 1kB-großen <a href="http://javascript.nwbox.com/ContentLoaded/contentloaded.js" rel="nofollow noopener noreferrer">Workaround</a> für den IE gemacht werden.</p> <p>Alles in allem, Mathias, gewinne auch ich den Eindruck, dass Du <a href="https://forum.selfhtml.org/?t=187767&m=1248739" rel="noopener noreferrer">manchmal einfach zu schnell tippst</a>.</p> <p>Gruß aus Berlin!<br> eddi</p> <div class="signature">-- <br> VEB Opel, Geruchsproben und Stasi 2.0, Zensur...<br> IHR WOLLTET MERKEL! </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 23:05:30 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371556#m1371556 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371556#m1371556 <blockquote> <ul> <li>Nächster Schritt: <a href="http://molily.de/js/einbindung.html#domcontentloaded-crossbrowser" rel="nofollow noopener noreferrer">DOMContentLoaded</a> statt window.onload (das können alle Frameworks von Haus aus)</li> </ul> </blockquote> <p>Der Link war vielleicht zu spezifisch. Um DOMContentLoaded zu verstehen, sollte man zumindest vom <a href="http://molily.de/js/einbindung.html#onload" rel="nofollow noopener noreferrer">Anfang des Unterkapitels</a> an lesen.</p> <p>Das Ausgangsproblem, bei dem DOMContentLoaded ansetzt, hat <a href="https://forum.selfhtml.org/?t=187783&m=1248878" rel="noopener noreferrer">Struppi</a> ganz gut beschrieben: window.onload wartet auf das Laden aller externen Ressourcen, für das sog. DOM-Scripting, also das Registrieren von Event-Handlern bei Elementen im DOM, braucht man aber lediglich Zugriff auf den DOM-Baum. Dieser Event tritt eben schon viel früher ein.</p> <p>Mathias</p> <div class="signature">-- <br> <a href="http://molily.de/selfhtml-forum-js/" rel="nofollow noopener noreferrer">JavaScript-Erweiterung für das SELFHTML-Forum</a> </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 16:20:52 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371559#m1371559 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371559#m1371559 <p>Hi,</p> <blockquote> <blockquote> <ul> <li>Eine <a href="http://molily.de/js/einbindung.html#addevent-helfer" rel="nofollow noopener noreferrer">addEvent-Funktion</a> (oder ein Framework der Wahl)</li> <li>Diese mehrfach aufrufen immer dort, wo ein Modul notiert wird</li> </ul> </blockquote> <p><a href="https://forum.selfhtml.org/?t=187785&m=1248926" rel="noopener noreferrer">Hier</a> schriebst Du mir noch etwas von Performence und jetzt soll ich statt onload ein deine addEvent-Funktion nehmen, was dem entsprechenden Beispiel völlig abwegig gar nicht funktionieren wird, weil das Element noch gar nicht im DOM-Baum ist</p> </blockquote> <p>Mathias benutzt addEvent, um mehrere Funktionen beim Eintreten des load-Ereignesses von window ausführen zu lassen - was soll da bitte im DOM noch gar nicht vorhanden sein?</p> <p>MfG ChrisB</p> <div class="signature">-- <br> Light travels faster than sound - that's why most people appear bright until you hear them speak. </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 22:17:52 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371558#m1371558 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371558#m1371558 <blockquote> <blockquote> <p>OMFG, das ist alles, aber nicht elegant!</p> </blockquote> <p>was soll das?</p> </blockquote> <p>Steht doch da: Dein Code ist nicht elegant. Das mag ich harsch formuliert haben, gebe ich gerne zu. Aber dass du zubeißt, offenbar ohne die Aussagen und Argumente meines Postings näher betrachtet zu haben, ist auch nicht gerade die feine englische.</p> <blockquote> <p>Es muss lediglich ein "zentrales" Array "gepflegt" werden -u nd nicht eine Umstantsprofessur durch eine über 1kB-großen <a href="http://javascript.nwbox.com/ContentLoaded/contentloaded.js" rel="nofollow noopener noreferrer">Workaround</a> für den IE gemacht werden.</p> </blockquote> <p>Ich glaube, da missverstehst du etwas. DOMContentLoaded ist ein anderer Ansatz als window.onload. Er ist kein »Workaround für den IE«. Der IE-spezifische Teil ist 19 Zeilen lang. Was es damit auf sich hat, habe ich versucht, in meiner JavaScript-Doku zu beschreiben.</p> <p>Mathias</p> <div class="signature">-- <br> <a href="http://molily.de/selfhtml-forum-js/" rel="nofollow noopener noreferrer">JavaScript-Erweiterung für das SELFHTML-Forum</a> </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 16:47:05 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371560#m1371560 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371560#m1371560 <p>Hallo ChrisB,</p> <blockquote> <p>| > - Eine <a href="http://molily.de/js/einbindung.html#addevent-helfer" rel="nofollow noopener noreferrer">addEvent-Funktion</a> (oder ein Framework der Wahl)<br> | > - Diese mehrfach aufrufen immer dort, wo ein Modul notiert wird<br> |<br> | <a href="https://forum.selfhtml.org/?t=187785&m=1248926" rel="noopener noreferrer">Hier</a> schriebst Du mir noch etwas von Performence und jetzt soll ich statt onload ein deine addEvent-Funktion nehmen, was dem entsprechenden Beispiel völlig abwegig gar nicht funktionieren wird, weil das Element noch gar nicht im DOM-Baum ist</p> <p>Mathias benutzt addEvent, um mehrere Funktionen beim Eintreten des load-Ereignesses von window ausführen zu lassen - was soll da bitte im DOM noch gar nicht vorhanden sein?</p> </blockquote> <p>Okay, das sehe ich jetzt auch so, <a href="https://forum.selfhtml.org/?t=187783&m=1248924" rel="noopener noreferrer">beschrieben hat er dies jedoch nicht</a>.<br> Im Beispiel unter <a href="http://molily.de/js/einbindung.html#addevent-helfer" rel="nofollow noopener noreferrer">21.2 addEvent-Helferfunktionen</a> spiegelt sich dies ebensowenig wieder:</p> <pre><code class="block language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>beispielabsatz<span class="token punctuation">"</span></span><span class="token punctuation">></span></span>Klick mich!<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span> <span class="token attr-name">type</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>text/javascript<span class="token punctuation">"</span></span><span class="token punctuation">></span></span> </code></pre> <pre><code>~~~javascript </code></pre> <p>function absatzKlick () {<br> alert("Der Absatz wurde geklickt!");<br> }<br> addEvent(document.getElementById("beispielabsatz"), "click", absatzKlick);</p> <pre><code class="block">`</script>`{:.language-html} Auch ist mir nicht ersichtlich, warum ~~~javascript function bla () {} addEvent(window, "load", bla); Modul = {    init: function () {} }; addEvent(window, "load", Modul.init); </code></pre> <p>hinter jedem "Modul" eleganter sein soll, als folgendes:</p> <p><code class="language-javascript">f<span class="token punctuation">.</span><span class="token function">push</span><span class="token punctuation">(</span><span class="token string">'functionsname'</span><span class="token punctuation">)</span><span class="token punctuation">;</span></code></p> <p>Gruß aus Berlin!<br> eddi</p> <div class="signature">-- <br> VEB Opel, Geruchsproben und Stasi 2.0, Zensur...<br> IHR WOLLTET MERKEL! </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 22:03:25 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371563#m1371563 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371563#m1371563 <blockquote> <p>Auch ist mir nicht ersichtlich, warum</p> <pre><code class="block language-javascript"></code></pre> </blockquote> <p>function bla () {}</p> <blockquote> <p>addEvent(window, "load", bla);</p> <p>Modul = {<br>    init: function () {}<br> };<br> addEvent(window, "load", Modul.init);</p> </blockquote> <pre><code class="block"> > > hinter jedem "Modul" eleganter sein soll, als folgendes: > > `f.push('functionsname');`{:.language-javascript} Weil es von der Funktionalität her etwas anderes ist und andere Möglichkeiten bietet. Objektnamen gibt man nicht als Strings an, wenn es nicht nötig ist. Wenn man den Namen mal ändern will, wird das automatisierte Refactoring schwierig. Wenn man irgendwann den Code in einer Funktion kapseln will, um ihn mit anderen Scripten zusammenarbeiten zu lassen, dann gibts keine globalen Funktionen mehr. Der Code würde unverändert weiter funktionieren, wenn man nicht window["funktionsname"], sondern mit Funktionsreferenzen gearbeitet hätte. In JavaScript sind i.d.R. nur Objekt-Referenzen interessant, nicht deren globale Namen. Mit Funktionsreferenzen arbeitet man beim Event-Handling eigentlich immer, ob man nun traditionelles Handling, addEventListener, attachEvent oder ein eigenes addEvent benutzt. Warum das Rad neu erfinden, indem man für window.onload plötzlich auf eine Lösung mit Strings mit Namen globaler Funktionen setzt. Das ist viel unflexibler als eine Lösung mit Referenzen. Wenn man seine JavaScripte [organisiert](http://aktuell.de.selfhtml.org/artikel/javascript/organisation/), Object-Literale, OOP oder andere Design Pattern verwendet, dann kann man gar nicht mit dutzenden losen globalen Funktionen arbeiten. Letzteres verleitet einen nur dazu, den globalen Namespace ungeordnet vollzuballern, was man bestenfalls von Anfang an vermeiden sollte. addEvent(window, "load", Modul.init); kann man gar nicht mit Funktionsnamen in einem String umsetzen. Mathias -- [JavaScript-Erweiterung für das SELFHTML-Forum](http://molily.de/selfhtml-forum-js/) </code></pre> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 22:39:57 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371561#m1371561 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371561#m1371561 <blockquote> <blockquote> <p>Mathias benutzt addEvent, um mehrere Funktionen beim Eintreten des load-Ereignesses von window ausführen zu lassen - was soll da bitte im DOM noch gar nicht vorhanden sein?<br> Okay, das sehe ich jetzt auch so, <a href="https://forum.selfhtml.org/?t=187783&m=1248924" rel="noopener noreferrer">beschrieben hat er dies jedoch nicht</a>.</p> </blockquote> </blockquote> <p>addEvent ist eine Allround-Funktion für jegliches Event-Handling. »window.onload« ist auch nur Event-Handling, also kann man addEvent (mit addEventListener/attachEvent) auch dafür verwenden.</p> <blockquote> <p>Im Beispiel unter <a href="http://molily.de/js/einbindung.html#addevent-helfer" rel="nofollow noopener noreferrer">21.2 addEvent-Helferfunktionen</a> spiegelt sich dies ebensowenig wieder:</p> <pre><code class="block language-html"></code></pre> </blockquote> <p><p id="beispielabsatz">Klick mich!</p></p> <blockquote> <p><script type="text/javascript"></p> </blockquote> <pre><code class="block"> > ~~~javascript function absatzKlick () { > alert("Der Absatz wurde geklickt!"); > } > addEvent(document.getElementById("beispielabsatz"), "click", absatzKlick); </code></pre> <blockquote> <p><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span></code></p> </blockquote> <p>Korrekt, das Beispiel demonstriert nicht das Registrieren von Handlern für den dokumentweiten load-Event. Es demonstriert den Einsatz beim Event-Handling bei DOM-Elementen. In dem Fall ist der Zugriff auf das Element natürlich vonnöten. Weil es in dem Beispiel bloß darum geht, den Aufruf von addEvent zu illustrieren, habe ich die <a href="http://molily.de/js/einbindung.html#traditionelles-schema" rel="nofollow noopener noreferrer">drei Teile</a> an der Stelle weggelassen und mit einem Script gearbeitet, was bereits durch seine Lage im Dokument Zugriff auf das zuvorliegende Element hat.</p> <p>Mit addEvent sähen diese (mit mehreren globalen Funktionen) so aus:</p> <pre><code class="block language-javascript"><span class="token comment">// 1. Teil </span> <span class="token function">addEvent</span><span class="token punctuation">(</span>window<span class="token punctuation">,</span> <span class="token string">"load"</span><span class="token punctuation">,</span> absatzKlickInit<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// 2. Teil </span> <span class="token keyword">function</span> <span class="token function">absatzKlickInit</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">addEvent</span><span class="token punctuation">(</span>document<span class="token punctuation">.</span><span class="token function">getElementById</span><span class="token punctuation">(</span><span class="token string">"beispielabsatz"</span><span class="token punctuation">)</span><span class="token punctuation">,</span> <span class="token string">"click"</span><span class="token punctuation">,</span> absatzKlick<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> <span class="token comment">// 3. Teil </span> <span class="token keyword">function</span> <span class="token function">absatzKlick</span> <span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> <span class="token function">alert</span><span class="token punctuation">(</span><span class="token string">"Der Absatz wurde geklickt!"</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Da ich das für nicht optimal halte und den Einsatz von DOMContentLoaded empfehle, habe ich (noch) kein entsprechendes Beispiel aufgenommen.</p> <p>Mathias</p> <div class="signature">-- <br> <a href="http://molily.de/selfhtml-forum-js/" rel="nofollow noopener noreferrer">JavaScript-Erweiterung für das SELFHTML-Forum</a> </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 23:46:10 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371562#m1371562 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371562#m1371562 <p>Re:</p> <blockquote> <p>| ~~~html</p> </blockquote> <p><p id="beispielabsatz">Klick mich!</p></p> <blockquote> <p>| <script type="text/javascript"></p> </blockquote> <pre><code class="block"> > | ~~~javascript function absatzKlick () { > | alert("Der Absatz wurde geklickt!"); > | } > | addEvent(document.getElementById("beispielabsatz"), "click", absatzKlick); </code></pre> <blockquote> <p>| <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span></code></p> </blockquote> <p>Genau darum dreht sich aber die Debatte - ja das Debakel - auf ein unübersichtlich, unnütiges und schwer wartbares <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span><span class="token punctuation">></span></span></code> zu verzichten. Für mich ist dann Ende mit Debatte. Die Standpunkte sind deutlich und gegensätzlich umrissen.</p> <p>Gruß aus Berlin!<br> eddi</p> <div class="signature">-- <br> Wer mit Kanonen auf Spatzen schießt, mag zwar immernoch Augen für die Tauben auf dem Dach haben, aber keine Hand zum reichen. </div> Funktion automatisch ausführen ohne onLoad Sun, 14 Jun 09 23:04:36 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371564#m1371564 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371564#m1371564 <p>Re:</p> <blockquote> <p>Objektnamen gibt man nicht als Strings an, wenn es nicht nötig ist. Wenn man den Namen mal ändern will, wird das automatisierte Refactoring schwierig. Wenn man irgendwann den Code in einer Funktion kapseln will, um ihn mit anderen Scripten zusammenarbeiten zu lassen, dann gibts keine globalen Funktionen mehr. Der Code würde unverändert weiter funktionieren, wenn man nicht window["funktionsname"], sondern mit Funktionsreferenzen gearbeitet hätte.</p> </blockquote> <p>Nicht jeder verfährt nach dem Konzept "Objekt ist gut™", da die ja so schön portabel sind, weil eierlegende Wollmilchsäue in der Programmierung von jeher ein graus sein sollten. Dementsprechend gebe ich aus verschiedenen, weiteren Gründen einer Einpassung von Code, also deren problemorientierten und zumeist nicht portablen Routinen, jedenfalls den Vorrang. Alles andere wäre für mich Dreamwave & Co bzw. Overhead.</p> <p>Aber lass uns nochmals auf ein anderen Einwurf von Dir eingehen:</p> <blockquote> <p>| | - Keine zentrale Initialisierungsfunktion</p> </blockquote> <p>Die Nutzung von onload hat eben aus Gründen der Übersichtlichkeit und Wartbarkeit von Code i. V. m. einer zentralen Initialisierungsfunktion große Vorteile. In einer Initialisierungsfunktion kann ich ganz einfach mittels <code class="language-javascript"><span class="token function">alert</span><span class="token punctuation">(</span>initial_array<span class="token punctuation">)</span></code> und ähnlichen Hilfsmitteln mir sehr schnell einen Überblick verschaffen. Ich muss auch nicht lange in den Gesamten Scripten und Dokumenten eines Projektes wühlen, um die Initialisierung zu ermitteln. Ich muss nur <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span><span class="token punctuation">></span></span></code> ausfindig machen und gucke mir an, was im onload steht.</p> <blockquote> <p>...Warum das Rad neu erfinden,...</p> </blockquote> <p>Richtig: <body onload="initial_funktion()"></p> <p>Kein zusätzlicher workarounds für den IE notwendig, übersichtlich und wartbar.</p> <blockquote> <p>Das ist viel unflexibler als eine Lösung mit Referenzen. Wenn man seine JavaScripte <a href="http://aktuell.de.selfhtml.org/artikel/javascript/organisation/" rel="nofollow noopener noreferrer">organisiert</a>, Object-Literale, OOP oder andere Design Pattern verwendet, dann kann man gar nicht mit dutzenden losen globalen Funktionen arbeiten.</p> </blockquote> <p>Triviale Probleme bedürfen keiner Objekte. Daran scheiden sich hier offensichtlich die Geister. Für das Originalproblem des Threads halte ich addEvent() für eine Alternative, Objekte, wie Du sie jetzt zum Argument instrumentalisierst, berühren das Thema IMHO jedoch gar nicht. Zudem steht immer noch Dein Einwurf bei einem Beispiel, der Performance wegen, dem entgegen, dass man lieber nicht mit Kanonen auf seine Spatzen schießen sollte.</p> <blockquote> <p>Letzteres verleitet einen nur dazu, den globalen Namespace ungeordnet vollzuballern, was man bestenfalls von Anfang an vermeiden sollte.</p> </blockquote> <p>Das halte ich für kein diskussionswürdiges Argument, da es nur um einen einzigen Variablennamen geht.</p> <blockquote> <p>addEvent(window, "load", Modul.init); kann man gar nicht mit Funktionsnamen in einem String umsetzen.</p> </blockquote> <p>Womit wir wieder bei der Notwendigkeit von Objekten wären...</p> <p>Mathias, schreib, was Du willst! Ich wäre auch nicht verlegen, gegen jedes Licht, was Du neu wirfst, auch den Schatten daran zu umreisen. Gib einfach bescheid, wenn Du Schwarzweiß in Form von Schach oder Go bevorzugen solltest. ;)</p> <p>Gruß aus Berlin!<br> eddi</p> <div class="signature">-- <br> VEB Opel, Geruchsproben und Stasi 2.0, Zensur...<br> IHR WOLLTET MERKEL! </div> Funktion automatisch ausführen ohne onLoad Mon, 15 Jun 09 00:04:45 Z https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371565#m1371565 https://forum.selfhtml.org/self/2009/jun/13/funktion-automatisch-ausfuehren-ohne-onload/1371565#m1371565 <blockquote> <p>Nicht jeder verfährt nach dem Konzept "Objekt ist gut™"</p> </blockquote> <p>JavaScript tut es jedenfalls, weil alles ein Objekt ist.<br> Aber inwiefern ist das ein Einspruch gegenüber meinen Aussagen? Verfährst du nach dem Konzept »Objekt ist schlecht«? Okay, was ist denn schlecht daran?</p> <blockquote> <p>Dementsprechend gebe ich aus verschiedenen, weiteren Gründen einer Einpassung von Code, also deren problemorientierten und zumeist nicht portablen Routinen, jedenfalls den Vorrang.</p> </blockquote> <p>Inwiefern ist der Ansatz mit Funktionsnamen als Strings problemorientierter? Ich sehe keinen Overhead darin, das eine Schema des Event-Handlings mit Callback-Funktionen durchzuhalten. Das ist so ziemlich das einfachste und weit verbreiteste in JavaScript. Wenn man es einmal gerallt hat, und das muss man, weil eben halb JS darauf aufbaut, dann kann man damit sehr elegante funktionale Problemlösungen finden.</p> <blockquote> <p>Die Nutzung von onload hat eben aus Gründen der Übersichtlichkeit und Wartbarkeit von Code i. V. m. einer zentralen Initialisierungsfunktion große Vorteile.</p> </blockquote> <p>Ich will gar nicht sagen, dass das in jeden Fall Unsinn ist, und ja, es kommt auf den Anwendungsfall an. Ich verwende selbst oft zentrale Initialisungsfunktionen der Art:</p> <p>window.onload = function () {<br>    Dies.init();<br>    Das.init();<br>    Jenes.init();<br> };</p> <p>-- wenn es denn zur Lösung des Problems ausreicht. Das stößt natürlich unglaublich schnell an seine Grenzen, wie man hier im Forum bei unzählig vielen JavaScript-Fragen sehen kann. Die Nachteile davon sind bekannt. Warum man das nicht im HTML unterbringt, ist auch hinreichend diskutiert. Ich habe schon öfters darüber geschrieben und kann nur auf <a href="http://aktuell.de.selfhtml.org/weblog/archiv/#author-mathias-schaefer-molily" rel="nofollow noopener noreferrer">meine zahlreichen Artikel</a> verweisen.</p> <p>Wenn man sich dieser Einschränkungen bewusst ist, ja, dann kann man obiges problemlos einsetzen. Wenn man aber ohnehin schon dazu übergeht, sich eine Helfer-Funktion à la »addLoadEvent« zu basteln, dann sollte man m.E. auch einen Schritt weiter gehen.</p> <p>Obiges Modell halte ich nicht für per se wartbarer als das Notieren eines addEvents beim Modul selbst. Das ist zum Teil schlicht Gewohnheit. Manche wollen Zusammenhängendes nahe beieinander, also auch die Registrierung der Init-Funktionen. Bei wenigen Scripten ist das auch problemlos zentral zu verwalten. Sobald man aber mehrere Scripte aus verschiedenen Quellen hat, die auf einer Site auch nicht alle notwendig gleichzeitig eingebunden und initialisiert werden, ist eine Modularisierung angebracht.</p> <p>Das geht meiner Erfahrung nach recht schnell - Grund genug für mich, Anfängern dazu zu raten, sich bereits recht früh in die fortgeschrittenen Methoden einzuarbeiten, weil sie früher oder später in die hinreichend bekannten Fettnäpfchen treten werden. Dafür, dass die meisten Leute heutzutage wohl JavaScript mit jQuery und Co. lernen, ist dieser Ansatz noch äußerst bodenständig. Wenn du dir mal meine JS-Doku anschaust, wirst du sicher erkennen, dass ich keinesfalls grundlos überkomplexe Lösungen empfehle. Ich verschweige aber auch nicht die Nachteile von einfachen und zeige flexiblere auf.</p> <blockquote> <p>In einer Initialisierungsfunktion kann ich ganz einfach mittels <code class="language-javascript"><span class="token function">alert</span><span class="token punctuation">(</span>initial_array<span class="token punctuation">)</span></code> und ähnlichen Hilfsmitteln mir sehr schnell einen Überblick verschaffen.</p> </blockquote> <p>Die Modulverwaltung meines <a href="http://molily.de/selfhtml-forum-js/" rel="nofollow noopener noreferrer">Forumsscriptes</a> funktioniert ähnlich - wenn auch vornehmlich aus anderen Gründen (es gibt verschiedene Seiten und ein Modul muss nicht notwendig bei allen Seiten initialisiert werden).</p> <blockquote> <p>Richtig: <body onload="initial_funktion()"></p> <p>Kein zusätzlicher workarounds für den IE notwendig, übersichtlich und wartbar.</p> </blockquote> <p>Nein, es ist nicht gut wartbar, JS-Code mit den Dokumenten zu verschmelzen. Das Konzept der klaren Trennung von HTML, CSS und JavaScript (Semantisches Markup + CSS-Layout + Unobtrusive JavaScript) ist einfach die größte Errungenschaft im Webdesign. Da sich in einem ausgelagerten JS äquivalent window.onload = initial_funktion; notieren lässt (bzw. weitaus flexiblere Methoden existieren), besteht keine Notwendigkeit, das fest in alle Dokumente zu schweißen - und alle anpassen zu müssen, wenn sich das einmal ändert.</p> <blockquote> <p>Triviale Probleme bedürfen keiner Objekte. Daran scheiden sich hier offensichtlich die Geister.</p> </blockquote> <p>Ich empfehle hier eigentlich fast immer Low-Level-Lösungen, wenn es denn um triviale Probleme geht.</p> <p>Vielleicht hast du das missverstanden, ich habe auf dein Posting ursprünglich nicht geantwortet, um eine alternative, auf den konkreten Fall des Fragestellers optimal zugeschnittene Lösung zu präsentieren. Vielmehr ging es mir um einen Ausblick auf - nun, eben »elegante« Lösungen, die sich an bestehenden funktionalen Programmiertechniken orientieren, in den restlichen JS-Gebrauch enschmiegen (addEvent kann man immer gebrauchen) und eine stärkere Flexibilität aufweisen. Darauf hinzuweisen halte ich für nötig angesichts dessen, dass eben nicht jeder Teilnehmer hier auf demselben Wissenstand ist.</p> <blockquote> <p>Für das Originalproblem des Threads halte ich addEvent() für eine Alternative, Objekte, wie Du sie jetzt zum Argument instrumentalisierst, berühren das Thema IMHO jedoch gar nicht.</p> </blockquote> <p>Wenn ich schon so weit bin, dass ich mehrere Initialisierungsfunktionen habe, dann hängen da meistens jeweils mehrere Funktionen und Variablen dran - Grund genug, diese in Objekten zu gruppieren (und sie bestenfalls konfigurierbar und wiederverwendbar zu machen). Das ist schlicht *die* JavaScript-typische Umsetzung - im Gegensatz zu vielen globalen Objekten mit Namespace-Präfixen im Namen.</p> <blockquote> <p>Zudem steht immer noch Dein Einwurf bei einem Beispiel, der Performance wegen, dem entgegen, dass man lieber nicht mit Kanonen auf seine Spatzen schießen sollte.</p> </blockquote> <p>Ich wüsste nicht, was an der Gruppierung von zusammenhängenden Funktionen und Variablen an einem Objekt-Literal unangemessen ist. Im Gegenteil, es verbessert die Übersichtlichkeit im Code enorm. Was hast du dagegen einzuwenden? Was ist daran komplex oder verschlechtert die Performance? Was bevorzugst du?</p> <blockquote> <blockquote> <p>Letzteres verleitet einen nur dazu, den globalen Namespace ungeordnet vollzuballern, was man bestenfalls von Anfang an vermeiden sollte.</p> </blockquote> <p>Das halte ich für kein diskussionswürdiges Argument, da es nur um einen einzigen Variablennamen geht.</p> </blockquote> <p>Ich habe nicht von »f« aus deinem Beispiel gesprochen, sondern von den vielen globalen Funktion samt »Anhängen«.</p> <blockquote> <p>Mathias, schreib, was Du willst!</p> </blockquote> <p>Den Eindruck, gegen eine Wand zu reden, habe ich tatsächlich.</p> <p>Mathias</p> <div class="signature">-- <br> <a href="http://molily.de/selfhtml-forum-js/" rel="nofollow noopener noreferrer">JavaScript-Erweiterung für das SELFHTML-Forum</a> </div>