JavaScript: Unterschied zwischen den Versionen

Aus Flinkwiki
Wechseln zu: Navigation, Suche
(→‎Youtube)
(→‎Bücher)
Zeile 224: Zeile 224:
  
 
* [https://www.eyrolles.com/Informatique/Livre/decouvrez-le-langage-javascript-9782212143997/ Johann Pardanaud, Sébastien de la Marck: Découvrez le langage JavaScript, Paris 2017 (EYROLLES)]
 
* [https://www.eyrolles.com/Informatique/Livre/decouvrez-le-langage-javascript-9782212143997/ Johann Pardanaud, Sébastien de la Marck: Découvrez le langage JavaScript, Paris 2017 (EYROLLES)]
 +
* [https://www.oreilly.de/buecher/120030/9783955618667-javascript-programmierung-von-kopf-bis-fu%C3%9F.html Eric Freeman / Elisabeth Robson: JavaScript-Programmierung von Kopf bis Fuß, Köln 2015]
  
 
----
 
----

Version vom 19. September 2019, 08:07 Uhr

Seitenübersicht
Zur Seite "Webprogrammierung"


Grundgerüst

Inline-Script

<!DOCTYPE HTML>

<html lang="de">

<head>
<meta charset="UTF-8">
<title>Inline-Script</title>
</head>

<body onload="window.alert('Dokument geladen!')">
<div id="panel">
<script type="text/javascript">document.write("Hallo Welt!");</script>
</div> 
</body>

</html>

Script im Head-Bereich

Beispiel 01


<!DOCTYPE HTML>

<html lang="de">

<head>
<meta charset="UTF-8">
<title>Script im Head-Bereich</title>

<script type="text/javascript">

function init()
{
  document.getElementById( "panel" ).innerHTML = "Hallo: Javascript-Grüße aus dem Head-Bereich!";

  window.alert( "Dokument wurde geladen!" ) ;
}

</script>

</head>

<body onload = "init()" >
<div id="panel"></div> 
</body>

</html>

Script in eingebetteter Datei

HTML-Datei external.html: 

<!DOCTYPE HTML>

<html lang="de">

<head>
<meta charset="UTF-8">
<title>Externes Script</title>
<script type="text/javascript" src="external.js"></script>
</head>

<body> 
<div id="panel"></div> 
</body>

</html>

Datei "external.js": 

function init()
{
  document.getElementById( "panel" ).innerHTML = "Hallo... von einer externen JavaScript-Datei!" ;
  window.alert( "Dokument geladen!" ) ;
}
window.onload = init ;


JavaScript-Konsole aufrufen

Chrome

Menüsymbol rechts oben > Weitere Tools > Entwicklertools > Reiter Console

oder F12 / strg+shift+i, Reiter Console

Shortcut: ctrl+shift+j oder Mac: alt+cmd+j

IE

F12 > Reiter Console

Firefox

Menüsymbol rechts oben > Entwickler-Werkzeuge > Web-Konsole

Shortcut: ctrl+shift+k oder Mac: cmd+alt+k

Opera

Rechtsklick > Element untersuchen (öffnet Dragonfly)

Mac: Darstellung > Entwicklerwerkzeuge > Opera Dragonfly > Reiter Konsole.

Shortcut Mac: cmd+alt+i

(Press Ctrl+Shift+I (Cmd+Option+I on Mac) to launch Opera Dragonfly which is a fully featured development and debugging tool integrated into the Opera browser.)

Safari

Safari: > Einstellungen > Erweitert > Menü "Entwickler in der Menüleiste anzeigen" > In der Menüleiste im Menü "Entwickler" > Javascript-Konsole einblenden

Shortcut: ctrl+alt+c oder Mac: cmd+alt+c

(Enable the Developer Menu from Safari's preferences. It will give access the various tools (Error Console, Web Inspector, JavaScript Profiler, etc). Of course there are also shortcuts, like Cmd+Alt+C for the console.)

Closures

Global variables can be made local (private) with closures.[1]

Pfeilfunktionen / arrow functions

Grundsyntax: 

() => { statements }

JSON

http://jsonplaceholder.typicode.com/posts

IIFE

Selbstauslösende Funktionen

Grundmuster:[2] 

(function () {
    //...
})();

Bei direkter Funktionsausführung entfällt die globale Variable.

Cookies

Promise / Future

Quellen

Links

Youtube

Bücher

| | |

Abgerufen von „https://flinkwiki.de/index.php?title=JavaScript&oldid=927“