Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
link fixes
  • Loading branch information
molily committed Nov 19, 2016
1 parent cb6e3b2 commit a46f032
Show file tree
Hide file tree
Showing 7 changed files with 14 additions and 14 deletions.
2 changes: 1 addition & 1 deletion ajax.html
Expand Up @@ -33,7 +33,7 @@ <h2>Was ist anders an Ajax?</h2>

<div id="begriff" class="section">
<h2>Der Begriff »Ajax« und seine Schwächen</h2>
<p>Der Begriff <em>Ajax</em> wurde ursprünglich im Jahr 2005 von dem richtungsweisenden Artikel <a href="http://www.adaptivepath.com/ideas/essays/archives/000385.php">A New Approach to Web Applications</a> von Jesse James Garrett geprägt. Ajax steht darin als Abkürzung für <em>Asynchronous JavaScript and XML</em> (auf Deutsch: asynchrones JavaScript und XML).</p>
<p>Der Begriff <em>Ajax</em> wurde ursprünglich im Jahr 2005 von dem richtungsweisenden Artikel <a href="http://adaptivepath.org/ideas/ajax-new-approach-web-applications/">A New Approach to Web Applications</a> von Jesse James Garrett geprägt. Ajax steht darin als Abkürzung für <em>Asynchronous JavaScript and XML</em> (auf Deutsch: asynchrones JavaScript und XML).</p>
<p>Diese Abkürzung stift leider mehr Verwirrung, als sie zum Verständnis beiträgt. Weder sind Ajax-Anwendungen asynchron in dem Sinne, dass die Kommunikation mit dem Server völlig losgelöst von Benutzereingaben stattfindet. Noch ist XML zwangsläufig das Übertragungsformat für Daten zwischen Client und Server. Garretts Konzept taugt wenig zum Verständnis der gegenwärtigen Praxis, die unter dem Schlagwort Ajax zusammengefasst wird.</p>
<p>In den meisten Fällen bezeichnet »Ajax« lediglich den JavaScript-gestützten Datenaustausch mit dem Webserver. XML in dabei nur ein mögliches, aber nicht das zentrale Übertragungsformat. Und asynchron bedeutet lediglich, dass die JavaScript-Ausführung beim Warten auf die Server-Antwort nicht den Browser blockiert, sondern dass JavaScript-Ereignisse gefeuert werden, wenn die Server-Antwort eingetroffen ist.</p>
</div>
Expand Down
6 changes: 3 additions & 3 deletions bibliotheken.html
Expand Up @@ -19,9 +19,9 @@ <h1>JavaScript: Bibliotheken und Frameworks</h1>
<div id="notizen" class="section">
<h2>Notizen</h2>
<ul>
<li><a href="http://blog.selfhtml.org/2007/10/20/javascript-bibliotheken/" class="anchor-online-page">JavaScript-Bibliotheken und die jüngere JavaScript-Geschichte</a></li>
<li><a href="http://blog.selfhtml.org/2008/09/04/thesen-javascript-gebrauch/" class="anchor-online-page">Sieben Thesen zum gegenwärtigen JavaScript-Gebrauch</a></li>
<li><a href="http://aktuell.de.selfhtml.org/artikel/javascript/organisation/#ausblick" class="anchor-online-page">Organisation von JavaScripten: Ausblick auf JavaScript-Frameworks</a></li>
<li><a href="http://blog.selfhtml.org/2007/10/20/javascript-bibliotheken/">JavaScript-Bibliotheken und die jüngere JavaScript-Geschichte</a></li>
<li><a href="http://blog.selfhtml.org/2008/09/04/thesen-javascript-gebrauch/">Sieben Thesen zum gegenwärtigen JavaScript-Gebrauch</a></li>
<li><a href="https://wiki.selfhtml.org/wiki/JavaScript/Organisation_von_JavaScripten#Ausblick_auf_JavaScript-Frameworks">Organisation von JavaScripten: Ausblick auf JavaScript-Frameworks</a></li>
</ul>
</div>
<div class="section" id="einfuehrung">
Expand Down
2 changes: 1 addition & 1 deletion browser.html
Expand Up @@ -180,7 +180,7 @@ <h3 class="unit-std-heading">Andere Typen abfragen</h3>
window.innerHeight + " Pixel breit!");
}</pre>
<div class="note-box note-box-todo">
<p class="note-box-title">ToDo: siehe den weiterführenden Artikel <a href="http://aktuell.de.selfhtml.org/artikel/javascript/objektabfragen/">Objektabfragen und Fallunterscheidungen in JavaScript</a></div>
<p class="note-box-title">ToDo: siehe den weiterführenden Artikel <a href="https://wiki.selfhtml.org/wiki/JavaScript/Objektabfragen">Objektabfragen und Fallunterscheidungen in JavaScript</a></div>
</div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion index.html
Expand Up @@ -83,7 +83,7 @@ <h1>Einführung in JavaScript</h1>
Sie können diese Texte wiederveröffentlichen, solange Sie die Quelle nennen. Sie können die Texte sogar fortschreiben, solange Sie sie unter den gleichen freien Bedingungen weitergeben. Diese Lizenz, kurz CC-BY-SA genannt, wird auch in der freien Enzyklopädie Wikipedia verwendet.</p>

<p><a href="http://github.com/molily/javascript-einfuehrung">JavaScript-Einführung auf Github</a><br>
Sie können die Dateien dieser Dokumentation über Github herunterladen sowie Änderungen daran verfolgen. Mit einem Github-Account und der Versionsverwaltung <em>Git</em> können Sie sich eine Kopie (<a href="http://help.github.com/forking/" lang="en" hreflang="en">Fork</a>) erstellen, Änderungen vornehmen und die Änderungen wieder zurücksenden (<a href="http://github.com/guides/pull-requests" lang="en" hreflang="en">Pull Request</a>).</p>
Sie können die Dateien dieser Dokumentation über Github herunterladen sowie Änderungen daran verfolgen. Mit einem Github-Account und der Versionsverwaltung <em>Git</em> können Sie sich eine Kopie (<a href="http://help.github.com/forking/" lang="en" hreflang="en">Fork</a>) erstellen, Änderungen vornehmen und die Änderungen wieder zurücksenden (<a href="https://help.github.com/articles/about-pull-requests/" lang="en" hreflang="en">Pull Request</a>).</p>

<p><em>Copy me, I want to travel (Bernadette La Hengst)<br>Copie-moi, je veux voyager (Rhythm King And Her Friends)</em></p>

Expand Down
4 changes: 2 additions & 2 deletions organisation-verfuegbarkeit.html
Expand Up @@ -411,7 +411,7 @@ <h3><code>this</code>-Kontext erzwingen mit <code>call</code> und <code>apply</c
<p>Die Methoden <code>call</code> und <code>apply</code> von Funktionsobjekten erlauben das Erzwingen des Kontextes beim Funktionsaufruf.</p>
</div>

<p>Da Funktionen in JavaScript Objekte erster Klasse sind, können sie selbst Methoden besitzen. Zwei der vordefinierten Methoden von Funktionsobjekten sind <a href="https://developer.mozilla.org/Core_JavaScript_1.5_Reference:Global_Objects:Function:call/en">call</a> und <a href="https://developer.mozilla.org/Core_JavaScript_1.5_Reference:Global_Objects:Function:apply/en">apply</a>. Diese rufen die zugehörige Funktion auf und erlauben es zusätzlich, den Kontext beim Aufruf einer Funktion explizit anzugeben. Das Objekt, auf das <code>this</code> innerhalb der Funktion zeigt, wird nicht mehr nach den üblichen Regeln bestimmt. Stattdessen zeigt <code>this</code> auf das Objekt, das <code>call</code> bzw. <code>apply</code> übergeben wird.</p>
<p>Da Funktionen in JavaScript Objekte erster Klasse sind, können sie selbst Methoden besitzen. Zwei der vordefinierten Methoden von Funktionsobjekten sind <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call">call</a> und <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply">apply</a>. Diese rufen die zugehörige Funktion auf und erlauben es zusätzlich, den Kontext beim Aufruf einer Funktion explizit anzugeben. Das Objekt, auf das <code>this</code> innerhalb der Funktion zeigt, wird nicht mehr nach den üblichen Regeln bestimmt. Stattdessen zeigt <code>this</code> auf das Objekt, das <code>call</code> bzw. <code>apply</code> übergeben wird.</p>

<p>Auf diese Weise können wir jede beliebige Funktion im Kontext eines beliebigen Objektes ausführen, auch ohne dass die Funktion am angegebenen Objekt hängt:</p>

Expand Down Expand Up @@ -651,7 +651,7 @@ <h3>Es gibt viele, bessere Binding-Funktionen</h3>

<p>Die hier vorgestellten <code>bind</code> und <code>bindAsEventListener</code> sind zwei <em>sehr einfache</em> Umsetzungen. Es gibt viele weitere, die mehr Komfort bieten und auf Performance optimiert sind. Die tatsächlichen Funktionen im Prototype-Framework ermöglichen es beispielsweise, dass Parameter der Wrapper-Funktion an die ursprüngliche Funktion weitergegeben werden. Die oben beschriebene <code>bind</code>-Funktion gibt lediglich die Parameter weiter, die beim <code>bind</code>-Aufruf angegeben wurden. <code>bindAsEventListener</code> aus Prototype erlaubt ebenfalls beides, während die obige Funktion nur das Event-Objekt weitergeben kann.</p>

<p>Neben Prototype bieten auch andere Frameworks und funktionale Bibliotheken Function Binding und Currying. Das Konzept ist dasselbe, die Umsetzungen und Benennungen unterscheiden sich im Detail. Das Framework <a href="http://mootools.net/">Mootools</a> bietet etwa <a href="http://mootools.net/docs/core/Native/Function#Function:bind">bind</a> und <a href="http://mootools.net/docs/core/Native/Function#Function:bindWithEvent">bindWithEvent</a>.</p>
<p>Neben Prototype bieten auch andere Frameworks und funktionale Bibliotheken Function Binding und Currying. Das Konzept ist dasselbe, die Umsetzungen und Benennungen unterscheiden sich im Detail. Das Framework <a href="http://mootools.net/">Mootools</a> bietet etwa <a href="http://mootools.net/core/docs/1.6.0/Types/Function#Function:bind">bind</a> und <a href="http://mootools.net/core/docs/1.6.0/Types/Function#Deprecated-Functions:bindWithEvent">bindWithEvent</a>.</p>

</div>

Expand Down
4 changes: 2 additions & 2 deletions sicherheit.html
Expand Up @@ -64,7 +64,7 @@ <h3>Local Machine Zone Lockdown (Internet Explorer)</h3>
<p>Die Same-Origin-Policy lässt einen Punkt außer Acht: Ein Script darf im Kontext der Herkunftsdomain ohne Begrenzung schalten und walten sowie mittels <code>XMLHttpRequest</code> Daten empfangen und versenden. Das kann zu einem schwerwiegenden Problem werden, wenn das Script nicht im Web, sondern <em>lokal</em> ausgeführt wird. <em>Lokal</em> bedeutet, dass das Dokument auf einer Festplatte des Client-Rechners liegt und von dort aus im Browser geöffnet wird. Die URI beginnt dann mit <code>file://localhost/</code>, in der Kurzschreibweise <code>file:///</code>.</p>
<p>Die Konsequenz ist, dass ein solches Script prinzipiell <strong>alle</strong> Dateien auf den erreichbaren Datenträgern auslesen kann (aber nicht ändern - zumindest nicht über <code>XMLHttpRequest</code> alleine). Mit einigen Kniffen können diese abgegriffenen Daten ins Web gesendet werden. Somit ließen sich vertrauliche Daten ausspionieren. Es stellt daher ein grundlegendes Problem dar, wenn fremde Dokumente mit JavaScript auf den eigenen Rechner gelangen.</p>
<p>Der Internet Explorer ab Windows XP mit dem Service Pack 2 stellt daher alle lokalen Dokumente mit Scripten unter Generalverdacht und verhindert ihre Ausführung. Dieser Sicherheitsmechanismus nennt sich <em>Local Machine Zone Lockdown</em>, zu deutsch <em>Sperrung der Zone des lokalen Computers</em>.</p>
<p>Wie sich dieser Generalverdacht auswirkt und wie man den Internet Explorer trotzdem dazu bringen kann, Scripte in lokalen Dokumenten auszuführen, erörtert der Artikel <a href="http://aktuell.de.selfhtml.org/artikel/sonstiges/markoftheweb/" class="anchor-online-page">Umgehung der Sperrung der lokalen Zone</a>.</p>
<p>Wie sich dieser Generalverdacht auswirkt und wie man den Internet Explorer trotzdem dazu bringen kann, Scripte in lokalen Dokumenten auszuführen, erörtert der Artikel <a href="https://wiki.selfhtml.org/wiki/JavaScript/Anwendung_und_Praxis/Local_Machine_Zone_Lockdown">Umgehung der Sperrung der lokalen Zone</a>.</p>
</div>

</div>
Expand Down Expand Up @@ -151,7 +151,7 @@ <h2>Zonenmodelle, Positivlisten und seitenspezifische Einstellungen</h2>

<div id="internet-explorer-seitenspezifisch" class="subsection">
<h3>Internet Explorer</h3>
<p>Der Internet Explorer verfügt über verschiedene <a href="http://support.microsoft.com/kb/174360/de" class="anchor-external">Sicherheitszonen</a>, die standardmäßig an gewisse Einstellungen gekoppelt sind. Eine normales HTML-Dokument im World Wide Web liegt in der <em>Internetzone</em>, ein Dokument auf dem lokalen Rechner oder im lokalen Netzwerk in der Zone <em>Lokales Intranet</em>.</p>
<p>Der Internet Explorer verfügt über verschiedene Sicherheitszonen, die standardmäßig an gewisse Einstellungen gekoppelt sind. Eine normales HTML-Dokument im World Wide Web liegt in der <em>Internetzone</em>, ein Dokument auf dem lokalen Rechner oder im lokalen Netzwerk in der Zone <em>Lokales Intranet</em>.</p>
<div class="note-box note-box-question">
<p class="note-box-title">Frage von: mschaefer</p>
<div class="note-box-text">Das kann so nicht stimmen, Local Machine Zone Lockdown nicht berücksichtigt?! Wie spielt die darein?</div>
Expand Down
8 changes: 4 additions & 4 deletions werkzeuge.html
Expand Up @@ -97,7 +97,7 @@ <h3>Internet Explorers: Fehlerkonsole der Entwicklertools</h3>
<h3>Fehlermeldungen in älteren Internet Explorern</h3>
<p>Sie sollten bei der JavaScript-Entwicklung die neueste Internet-Explorer-Version verwenden, wenn es nicht gerade um das absichtliche Testen mit älteren Versionen geht. Denn die Fehlermeldungen in älteren Versionen sind weniger präzise sowie oft unverständlich und verwirrend. In manchen Fällen wird die Zeilennummer nicht korrekt angegeben und bei ausgelagerten JavaScript-Dateien die tatsächliche Script-Adresse nicht angegeben, nur die Adresse des einbindenden HTML-Dokuments. Ältere Internet Explorer kennen keine Konsole, in der alle Fehlermeldungen mitgeloggt werden.</p>
<p class="image"><img src="images/ie7-fehlermeldung.png" alt=""></p>
<p>Ein komfortables Debugging von Scripten im Internet Explorer vor Version 8 ist daher ohne Zusatzprogramme schwer möglich. Ein mögliches Zusatzprogramm, das ein brauchbares Fehler-Logging anbietet, lautet <a href="http://www.my-debugbar.com/wiki/CompanionJS/HomePage">Companion.JS</a> bzw. <a href="http://www.debugbar.com/">DebugBar</a>. Einen komplexeren JavaScript-Debugger bietet die umfangreiche <a href="http://www.microsoft.com/germany/express/products/web.aspx">Visual Web Developer 2010 Express Edition</a>, die sich kostenlos herunterladen lässt.</p>
<p>Ein komfortables Debugging von Scripten im Internet Explorer vor Version 8 ist daher ohne Zusatzprogramme schwer möglich. Ein mögliches Zusatzprogramm, das ein brauchbares Fehler-Logging anbietet, lautet <a href="http://www.my-debugbar.com/wiki/CompanionJS/HomePage">Companion.JS</a> bzw. <a href="http://www.debugbar.com/">DebugBar</a>. Einen komplexeren JavaScript-Debugger bietet die umfangreiche <a href="https://msdn.microsoft.com/en-us/library/dd537667(v=vs.110).aspx">Visual Studio Express for Web</a>, die sich kostenlos herunterladen lässt.</p>
</div>

<div id="opera" class="subsection">
Expand Down Expand Up @@ -170,7 +170,7 @@ <h3>Kontrollausgaben über die <code>alert</code>-Methode</h3>

<div class="subsection" id="console-objekt">
<h3>Ablaufprotokolle mit Konsolen-Ausgaben (<code>console</code>-Objekt)</h3>
<p>Vielseitiger als Ausgaben mittels <code>window.alert</code> ist die Nutzung der Schnittstelle zur JavaScript-Konsole des Browsers. Diese wurde von Firebug für den Firefox erfunden, wurde aber mittlerweile vom Internet Explorer, Safari und Chrome für ihre Fehlerkonsolen zumndest rudimentär übernommen: <a href="http://getfirebug.com/console.html">Dokumentation der Konsole-API von Firebug</a>.</p>
<p>Vielseitiger als Ausgaben mittels <code>window.alert</code> ist die Nutzung der Schnittstelle zur JavaScript-Konsole des Browsers. Diese wurde von Firebug für den Firefox erfunden, wurde aber mittlerweile vom Internet Explorer, Safari und Chrome für ihre Fehlerkonsolen zumndest rudimentär übernommen: <a href="https://getfirebug.com/wiki/index.php/Console_API">Dokumentation der Konsole-API von Firebug</a>.</p>
<p>Das globale Objekt <code>window.console</code> bietet verschiedene Methoden an, mit denen Sie Statusmeldungen in die browsereigene Konsole schreiben können. In der Konsole haben Sie dann ein Log aller Meldungen Ihres Scriptes - ebenso wie etwaige Fehlermeldungen.</p>
<p>Das obige Beispiel könnte für Firebug mithilfe der Methode <code>console.debug</code> folgendermaßen umgesetzt werden:</p>
<pre>var überschriftenListe = document.getElementsByTagName("h1");
Expand Down Expand Up @@ -233,7 +233,7 @@ <h3>Internet Explorer 8: DOM-Inspektor der Entwicklertools</h3>

<div id="ie7-developer-toolbar" class="subsection">
<h3>Internet Explorer 6 und 7: Developer Toolbar</h3>
<p>Der Internet-Explorer-Versionen vor 8 verfügen über keinen eingebauten DOM-Inspektor. Es existiert allerdings ein offizieller Zusatz: Die <a href="http://www.microsoft.com/downloads/details.aspx?familyid=e59c3964-672d-4511-bb3e-2d5e1db91038&amp;displaylang=en">Internet Explorer Developer Toolbar</a>. Diese ist ein Vorgänger der Entwicklertools im Internet Explorer 8 und die Bedienung gestaltet sich weitgehend gleich.</p>
<p>Der Internet-Explorer-Versionen vor 8 verfügen über keinen eingebauten DOM-Inspektor. Es existiert allerdings ein offizieller Zusatz: Die <a href="http://web.archive.org/web/20100328172952/http://www.microsoft.com/downloads/details.aspx?displaylang=en&amp;FamilyID=E59C3964-672D-4511-BB3E-2D5E1DB91038">Internet Explorer Developer Toolbar</a>. Diese ist ein Vorgänger der Entwicklertools im Internet Explorer 8 und die Bedienung gestaltet sich weitgehend gleich.</p>
<p>Nachdem Sie den Zusatz installiert haben, können Sie die Toolbar aktivieren, indem Sie im Menü <em>Ansicht → Explorer-Leiste → IE Developer Toolbar</em> aktivieren. Gegebenenfalls ist das Menü im Internet Explorer 7 standardmäßig ausgeblendet - Sie können es kurzzeitig einblenden, indem Sie die Alt-Taste drücken. Die Toolbar erscheint am unteren Fensterrand und Sie können deren Höhe variieren.</p>
<p>Das Beispieldokument wird in der IE Developer Toolbar folgendermaßen veranschaulicht:</p>
<p class="image"><img src="images/ie-developer-toolbar.png" alt=""></p>
Expand Down Expand Up @@ -297,7 +297,7 @@ <h2>Code-Komprimierer und -Formatierer</h2>
<p>Bei der JavaScript-Programmierung sollten Sie gewisse Konventionen zur Code-Formatierung einhalten. Das dient nicht nur der Lesbarkeit, Übersichtlichkeit und Klarheit des Quellcodes, sondern macht erst effektive Fehlersuche und Debugging möglich. Das beinhaltet grob gesagt eine Anweisung pro Zeile sowie eine Einrückung innerhalb von Blöcken (Funktionen, Kontrollstrukturen usw.). Wie das im Detail aussieht, ist Ihrem Geschmack überlassen.</p>
<p>Wenn das JavaScript jedoch im Browser ausgeführt wird, ...</p>
<ul>
<li><a href="http://code.google.com/intl/de/closure/compiler/">Google Closure Compiler</a></a></li>
<li><a href="https://developers.google.com/closure/compiler/">Google Closure Compiler</a></a></li>
<li><a href="http://closure-compiler.appspot.com/home">Closure Compiler Service</a></li>
<li><a href="http://marijnhaverbeke.nl/uglifyjs">uglifyjs</a></li>
</ul>
Expand Down

0 comments on commit a46f032

Please sign in to comment.