INDEXSYMBOLE$() als Abkürzung für jQuery() 296, 299, 313$() Konflikte mit Skripts, die $ verwenden 361$.ajax() (jQuery-Methode) 388, 405$(document).ready(function(){...} ) 312$(function() { ... }) 364–365$(this) 324, 549+= (Anhängen an einen String) 125+= Anhängen an einen String 111{} Codeblock (Funktion) 90() Endklammern (Funktionsaufruf) 97== Gleich 150, 168> Größer als 151>= Größer oder gleich 151() Gruppierungsoperator 97< Kleiner als 151<= Kleiner oder gleich 151&& Logisches AND 157–158, 537! Logisches NOT 157, 159|| Logisches OR 157, 159, 169. Memberoperator 103=== Strikt gleich 150, 168!== Strikt ungleich 150, 168!= Ungleich 150, 168// (URL ohne http:) 355[] Zugriff auf Objekteigenschaften 103= Zuweisungsoperator 107

AAbmessungen, Kästen 348.abort() (jqXHR-Objekt) 389Abschicken-Schaltflächen 578–579.accordion() (jQuery UI) 430action (DOM-Eigenschaft) 572.add() (jQuery-Methode) 531add() 584.addClass() (jQuery-Methode) 320, 498, 512–513, 519, 565addEventListener() (DOM-Methode) 254–255, 570–571Adresse (aktueller URL) 124.after() (jQuery-Methode) 318, 535$.ajax() (jQuery-Methode) 398–399Ajax

Anforderungen erstellen 373Anworten verarbeiten 373CORS (Cross Origin Resource Sharing) 384Datenformate

HTML 374JSON 374, 376–377XML 374–375

Daten mit Angular laden 438Einführung 370–372Formulare, .serialize() 394HTML-Daten laden 378–379HTML-Daten laden (jQuery) 390–393jQuery 388–389

$.ajax() 398–399Formulare abschicken 394–395jqXHR-Objekt 389, 405Kurzmethoden 392–393

$.get() 392–393$.getJSON() 392$.getScript() 392$.post() 392

.load() 390–391, 407, 427

.post() 394–395jqXHR-Objekt

EigenschaftenresponseText 389responseXML 389status 389statusText 389

Methoden.abort() 389.always() 389.done() 389.fail() 389

JSON$.getJSON() 396–397JSON-Daten laden 382–383JSON-Daten laden (jQuery) 396–397

JSON-Objektparse() 377stringify() 377

Proxy (Daten von einem anderen Server laden) 384Relative URLs 389URLs aktualisieren 424–427URLs pflegen 424–427XDomainRequest-Objekt (IE8-9) 384XML-Daten laden 380–381XMLHttpRequest-Objekt 372

EigenschaftenresponseText 379, 383responseXML 380status 373, 378–379

open() 373send() 373

Akkordeon siehe ZiehharmonikaAktueller URL

Eigenschaft location des window-Objekts 36alert() (window-Objekt) 125Altersprüfung 617–619.always() (jqXHR-Objekt) 389, 396Änderungsereignisse 284–285AngularJS 428, 434–439.animate() (jQuery-Methode) 365, 493, 521Animation 515, 520–521Anonyme Funktionen 88, 96Anweisungen 56Anzahl der Zeichen in einem String 128–130APIs

API-Schlüssel 441Einführung 410, 412HTML5-APIs 413

Ortungs-API 416–419Verlaufs-API 424–427Webspeicher-API 420–423

Konsolen-API 470Plattform-APIs 440

Google Maps 441–446Skripts

AngularJS 434–439Skripts mit APIs 428

.append() (jQuery-Methode) 318, 565appendChild() (DOM-Methode) 222, 240.appendTo() (jQuery-Methode) 505, 519Argumente 93, 109Array-Objekt

length 118–119push() 542–543

Arrays 530Als Objekte 118–119Arrayartige Objekte (jQuery) 308, 340Arrays aus Objekten 119Durchlaufen 175, 535Elemente hinzufügen und entfernen 530Erstellen 128Mehrere Rückgabewerte einer Funktion 95Methoden

concat() 530every() 530filter() 530, 536–537forEach() 530, 536–537map() 530pop() 530push 540push() 519, 530reverse() 530shift() 530some() 530sort() 530, 554unshift() 530

split() (String-Objekt) 619Unterschiede zu Variablen und Objekten 116–117

Asynchrones Laden 509Asynchrone Verarbeitung 371attachEvent() 255, 290

Browserübergreifende Lösung 570–571.attr() (jQuery-Methode) 320, 498, 512–513Attribute

Ändern 232, 320Ändern (jQuery) 320Erstellen 234

Attributknoten 232–235Aufruf einer Funktion 91Ausdrücke

Funktionsausdrücke 96Vergleichen 154

Ausführungskontext 453–456Ausführungsreihenfolge 452Ausnahmen 458

Fehlerbehandlung 480–481Auswahlfelder 584–587Auswerten von Bedingungen 150Automatische Vervollständigung 370

Bback() (history-Objekt) 426Barrierefreiheit 491Bedingte Anweisungen 149

Bedingter Lader 596–597if 160–161, 181if... else 162–163switch 164–165, 291

Bedingtes Laden 596–597Bedingungsoperatoren 150.before() (jQuery-Methode) 318beforeunload 286–287Bereichsschieberegler 432Bibliotheken 360Bilder 511Bildschirmabmessungen 124–125Bindung von Ereignissen 248, 250blur 247, 274–275, 282, 573, 588–589blur() (DOM-Methode) 573Boolescher Datentyp 62Boolesche Werte 62break 174Browser

Abmessungen 124–125, 350Browserunterstützung siehe ModernizrBrowserunterstützung in den Beispielen 10Entwicklerwerkzeuge

Debugging 464–465DOM untersuchen 236–237

JavaScript-Konsole 464–465Rendering-Engine 40Rollbalken 350

Browser Object Model 124–125Einführung 121–122history-Objekt 122, 124–125, 424–427location-Objekt 122navigator-Objekt 122screen-Objekt 122, 124–125window-Objekt 122, 124–125

Bubbling 260–261:button (jQuery-Selektor) 342

CCallback-Funktion (JSONP) 385cancelable (event-Objekt) 262Capturing 260–261catch 480–481, 576–577CDN 354–355ceil() (Math-Objekt) 134change 247, 282, 573, 586–587charAt() (String-Objekt) 128–130:checkbox (jQuery-Selektor) 342:checked (jQuery-Selektor) 342checked (DOM-Eigenschaft) 573, 580.children() (jQuery-Methode) 336click 39, 246, 276–277, 573.click() (jQuery-Methode) 512–513click() (DOM-Methode) 573clientX (event-Objekt) 278

clientY (event-Objekt) 278.clone() (jQuery-Methode) 346.closest() (jQuery-Methode) 336Codeabhängigkeiten 616Codeblöcke

Einführung 56Funktionen 90

Codewiederverwendung 616.complete() (jQuery-Methode) 396concat() (array-Objekt 530:contains() (jQuery-Selektor) 338continue 174, 595copy (Ereignis) 247CORS (Cross Origin Resource Sharing) 384Cross-Site Scripting (XSS) 228–231.css() (jQuery-Methode) 322, 510–511, 521CSS 9

CSS-artige Selektoren in jQuery 302–303Eigenschaften und Werte 9Formatierung ändern 497–499Formatierung ändern (jQuery) 322–323Formatierungsstile ändern (DOM) 195id-Attribut ändern 232Kastenabmessungen 348Klassen

Ändern mit jQuery 320–321Klassennamen ändern 232

Selektoren zum Auswählen von Elementen 193, 202cut (Ereignis) 247

DDarstellungsschicht 44.data() (jQuery-Methode) 546, 565, 602, 608–609Dateierweiterungen

.js 46

.min.js 298Datenbindung 437Datenformate

Ajax 374Objektliteral 534

DatenmodelleArrays aus Objekten 119Arrays in Objekten 119Arrays und Objekte als Datenstrukturen im Vergleich 533Einführung 26–27Objekte und Eigenschaften 28Objektliteralschreibweise 586Vergleichstechniken 116–117

Datenportabilität 374Datentypen

Boolesche WerteTruthy und falsy 167

Einfache (primitive) DatentypenBoolean 131Null 131Number 131String 128–131Undefined 131

Implizite Typumwandlung und schwache Typisierung 166

Komplexe DatentypenObjekte (Arrays und Funktionen) 131

Number 132–135Numerisch 62Strings 62

Daten von einem anderen Server anzeigen 385–388Date-Objekt 619

Abstand zwischen zwei Daten 139Datumsformate 136–137, 139Erstellen 138, 143Kalenderdaten berechnen 143Konstruktor 137Methoden

getDate() 137getDay() 137getFullYear() 137getHours() 137getMilliseconds() 137getMinutes() 137getMonth() 137getSeconds() 137getTime() 137getTimeZoneOffset() 137setDate() 137setFullYear() 137setHours() 137setMilliseconds() 137setMinutes() 137setMonth() 137setSeconds() 137setTime() 137toDateString() 137toString() 137toTimeString() 137

Monatsnamen 143Tagesnamen 143

Datumsangaben 432–433Datumsauswahl 432–433, 591, 619Monatsnamen 137Sortieren 559Vergleichen 619Wochentage 137

dblclick 246, 276Debugging

Tipps 484Vorgehensweise 463

defaultChecked (DOM-Eigenschaften) 573defaultValue (DOM-Eigenschaften) 573Deklarieren von Funktionen 90Deklarieren von Variablen 60.delay() (jQuery-Methode) 364Delegierung 331delete 107, 112, 533Deserialisierung 382Design Pattern siehe Entwurfsmuster.detach() (jQuery-Methode) 346, 502–503, 505Developer Tools siehe EntwicklerwerkzeugeDiashow 515–520:disabled (jQuery-Selektor 342

disabled (DOM-Eigenschaften) 573, 578document-Objekt 38–39, 123

Eigenschaftendomain 126lastModified 126–127title 126–127URL 126–127

Einführung 36–37getElementById() 39keypress-Ereignis 39lastModified 36, 39load-Ereignis 39Methoden

createElement() 126createTextNode() 126getElementById() 126querySelectorAll() 126write() 126

title 36, 39write() 39, 49, 226

Dokumentknoten 186–187DOMContentLoaded 286, 287DOM (Document Object Model) 126–127

Arbeiten mit dem DOM 188Attribute ändern 232–235Attributknoten 187, 232–235

class 232id 232

document-Objekt 36–39Dokumentknoten 186DOM-Abfragen 190

Leistung 192Zwischenspeichern 575

DOM-Baum 40–41, 186–187Ändern 212–213DOM durchlaufen 208, 210–211Untersuchen (Browser-Werkzeuge) 236–237

DOM-Bearbeitung 219, 222–225, 227Durchlaufen 208Durchlaufen (jQuery) 336, 548–549Einführung 121, 123Elemente ändern 212Elemente auswählen

getElementById('id') 193Elemente erstellen

createElement() 222Elemente hinzufügen

appendChild() 222insertBefore() 222, 240

ElementeigenschaftenclassName 195innerHTML 218, 220–221textContent 216

Elementknoten 186, 189Ereignisse

Ereignishandler 252–253Ereignislistener 250, 254–255, 263, 265

HTML-Inhalt ändernDOM-Bearbeitung 219innerHTML 218–221, 227

Knoten 40Knotenliste 192

Aktive und statische Knotenlisten 196Elemente aus einer Knotenliste auswählen 198–199In einer Schleife durchlaufen 204–205length 196

Weißraum 209–211Textinhalt ändern

nodeValue 214–215textContent und innerText 216

Textknoten 187createTextNode() 222

Untersuchen (Browser-Werkzeuge) 236–237Verweise auf Elemente speichern 191Zugriff auf Elemente 192–194

getElementById 194–195getElementsByClass() 197getElementsByClassName 200getElementsByClassName('class') 193getElementsByTagName() 197, 201getElementsByTagName('tagName') 193querySelector() 194, 202querySelectorAll() 197querySelectorAll('css selector') 193querySelector('css selector') 193

Zwischenspeichern von DOM-Abfragen 190DOMNodeInserted 247, 284–285DOMNodeInsertedIntoDocument 247, 284DOMNodeRemoved 247, 284DOMNodeRemovedFromDocument 247, 284DOMSubtreeModified 247, 284.done() (jqXHR-Objekt) 389, 396, 405Do-while-Schleifen 177Dropdownfelder 584–587DRY-Prinzip (Don't Repeat Yourself) 616Durchlaufen des DOM 208Dynamische Filterung 538–541

Ee (Abkürzung für event- oder error-Objekt) 328.each() (jQuery-Methode) 324, 498, 519, 531, 546–547ECMAScript 532Eigenschaften

Einführung 28–29, 100–101Name/Wert-Paare 28

ElementeAbmessungen (jQuery) 348Ändern 212–213Ändern (DOM) 212–213Ändern (jQuery) 313, 346Auschneiden, kopieren und einfügen 346Ausgewählte Elemente in jQuery 302–303Auswählen 342createElement() 126, 222, 240Erstellen 222Formularelemente (jQuery) 343Inhalt ändern 218–227Neue Elemente einfügen (jQuery) 318–319Suchen (jQuery) 336

Text änderninnerText und textContent 216–217nodeValue 214–215

Verbergen 582–583Verschieben im DOM-Baum 208

elements (Sammlung) 572.empty() (jQuery-Methode) 346, 505:enabled (jQuery-Selektor) 342Endklammern 97Entscheidungen 148Entwicklerwerkzeuge 236–237, 464–465Entwurfsmuster 501.eq() (jQuery-Methode) 512–513, 521Ereigniserfassung 260Ereignisse

Änderungsereignisse und Beobachter 284–285Arten von Ereigissen

Formularereignisse (jQuery) 343Arten von Ereignissen

Browserereignisse 271HTML5-Ereignisse 271, 286Mausereignisse 276–277UI-Ereignisse 272W3C-DOM-Ereignisse 271

beforeunload 286, 287Betätigtes Element in der Benutzeroberfläche 262, 270Bindung 248, 250blur 274–275, 282, 588–589change 282, 586–587click 276–277dblclick 276Delegierung 266, 290Delegierung (jQuery) 331DOMContentLoaded 286–287DOMNodeInserted 284–285DOMNodeInsertedIntoDocument 284DOMNodeRemoved 284DOMNodeRemovedFromDocument 284DOMSubtreeModified 284Einführung 5, 30–31, 244Ereignisfluss 260–261Ereignishandler 250, 252Ereignislistener 250, 254–255

Entfernen 255Parameter angeben 257, 263

error 272Ereignisbehandlung (browserübergreifend) 570event-Objekt 262–263, 265

Eigenschaftencancelable 262clientX 278–279clientY 278–279pageX 278–279pageY 278–279screenX 278–279screenY 278–279target 262type 262

MethodenpreventDefault() 262, 267, 283stopPropagation() 262, 267

event-Objekt (jQuery) 328–329Eigenschaften

data 328pageX 328pageY 328target 328timeStamp 328type 328which 328

Methoden.preventDefault() 328.stopPropagation() 328

focus 274–275, 282, 588–589, 594–595focusin 274focusout 274Funktionen auslösen 248hashchange 286HTML-Ereignishandler 250–251IE8-Ereignismodell

attachEvent() 255, 258–259, 290Ausweichlösung 259Browserübergreifende Lösung 570–571Entsprechende Eigenschaften und Methoden 262event-Objekt 264–265jQuery 301

input 280, 282, 588–589jQuery-Ereignisse 326–331, 343keydown 280keypress 280–281keyup 280Leistung 266load 272–273mousedown 276mousemove 276mouseout 276mouseover 276mouseup 276Position bestimmen 278resize 272scroll 272submit 282Touchscreen-Ereignisse 271UI-Ereignisse 246, 248unload 272

.error() (jQuery-Methode) 396error (Ereignis) 246, 272EvalError 459, 459–460Event-Objekt

target 576every() (array-Objekt) 530Exception siehe Ausnahmen

F.fadeIn() (jQuery-Methode) 365.fadeOut() (jQuery-Methode) 510–511.fadeTo() (jQuery-Methode) 510–511.fail() (jqXHR-Objekt) 389, 396, 405Falsy und truthy 167Farbwähler 591

Feature-Erkennung 301, 414, 593Modernizr 415

Fehlerbehandlung 458, 480–481, 576–577Ausnahmebehandlung 480–481Debugging 463Debugging von JSON-Daten 474Häufig auftretende Fehler 485NaN 461Tipps zum Debugging 484try... catch 576–577

FehlerbehebungAjax funktioniert in Chrome nicht lokal 378Bei äquivalenten Werten wird keine Übereinstimmung

festgestellt 166Ereignisse werden mehrmals ausgelöst 260IE führt lokal gespeicherte Skripts nicht aus 47jQuery-Objekt gibt nur Daten vom ersten Element

der Auswahl zurück 307Über Ajax angeforderte Medien werden nicht

angezeigt 389Fehlerobjekte 459, 461, 481

EvalError 459RangeError 459ReferenceError 459SyntaxError 459TypeError 459URIError 459

:file (jQuery-Selektor) 342.filter() (jQuery-Methode) 343, 531, 548filter() (array-Objekt) 530, 536–537Filterung

Einführung 534Galeriebeispiel 548–549Schlagwörter 544–549

finally 480–481.find() (jQuery-Methode) 336, 498, 519, 565Firebug 237firstChild (DOM-Eigenschaft) 208, 211Flags 578–579floor() (Math-Objekt 134Flussdiagramme

Einführung 18, 23Entscheidungen 148

fn-Objekt (jQuery) 523.focus() (jQuery-Methode) 619:focus (jQuery-Selektor) 342focus() (DOM-Methode) 273, 573focus (Ereignis) 247, 274–275, 282, 573, 588–589, 594–595focusin 247, 274focusout 247, 274forEach() (array-Objekt) 530, 536–537Formulare

Abschicken 574–575Abschicken-Schaltfläche 578–579

Deaktivieren 578–579Wiederholtes Abschicken verhindern 578–579

Auswahlfelder 584–587Füllen 584–585

Bereichsschieberegler 591Betätigtes Element ermitteln 576

Code beim Abschicken ausführen 574–575Datumsauswahl 591Eigenschaften

action 572checked 573defaultChecked 573defaultValue 573disabled 573elements 572elements collection 574–575form 573method 572multiple 584name 572–573options 584selected 573selectedIndex 584selectedOptions 584type 573, 576value 573

Elemente auswählen 342Elemente je nach Zustand anderer Elemente anzeigen

oder verbergen 618elements (Sammlung) 600Ereignisse 282–283

blur 573, 588–589change 573, 586–587click 573focus 573, 588–589, 594–595input 573, 588–589keydown 573keypress 573keyup 573reset 572submit 572

Erweiterung 568Fokus auf ein Element 619jQuery UI 432–433

Datumsauswahl 432–433Schieberegler 432–433

Kontrollkästchen 580–581Methoden

add() 584blur() 573click() 573focus() 573remove() 584reset() 572select() 573submit() 572, 574–575

Optionsschalter 582–583Welche Option wurde ausgewählt 584–587Wurde ein Schalter markiert 582–583

Passwortlänge 620–621Passwortübereinstimmung 620–621Steuerelemente 573Texteingaben

Farbe ändern 594–595Wert ändern 594–595

Textfelder 588–589Zeichenzähler 588–589

Typ eines Steuerelements ändern 576Validierung 282, 598–619

Alter 617–619Datumsangaben 590, 611Einführung 568, 598E-Mail-Adressen 590, 611Erforderliche Elemente 607Farbe 590Höchstwert 591HTML5-Formularvalidierung 590

Abschalten 591Länge von Texteingaben 588–589, 615Markierte Kontrollkästchen 580Markierte Optionsschalter 582–583Mindestwert 591Passwortlänge 615Passwortübereinstimmung 615Reguläre Ausdrücke 612–613test() 611URLs 590Werte prüfen 607Zahlen 590, 611Zeichenzähler 588–589

for-Schleifen 172–173, 175, 207forward() (history-Objekt) 426Funktionen

Anonyme Funktionen 88Argumente 93Aufrufen 91Callbackfunktion (JSONP) 385Codeblock 90Deklarieren 90, 96Einführung 88–89Endklammern 97Funktionsausdrücke 96Hilfsfunktionen 570–571initialize 542Parameter 88, 92–93return 587Rückgabewerte 94–95this 270

Funktionsebene (Gültigkeitsbereich) 98

GGebietsschema 137geolocation-Objekt (Ortungs-API) 417$.get() (jQuery-Methode) 388, 392–393getAttribute() (DOM-Methode) 232–233getCurrentPosition() (Ortungs-API) 417–419getDate() (Date-Objekt) 137getDay() (Date-Objekt) 137getElementById() (DOM-Methode) 126, 193–195getElementsByClassName() (DOM-Methode) 193, 197, 200getElementsByTagName() (DOM-Methode) 193, 197, 201, 240getFullYear() (Date-Objekt) 137getHours() (Date-Objekt) 137

getItem() (Speicher-API) 421–423$.getJSON() (jQuery-Methode) 388, 392, 396–397, 405getMillseconds() (Date-Objekt) 137getMinutes() (Date-Objekt) 137getMonth() (Date-Objekt) 137$.getScript() (jQuery-Methode) 388, 392getSeconds() (Date-Objekt) 137getTime() (Date-Objekt) 137getTimezoneOffset() (Date-Objekt) 137Gleichheit 168Gleichheitszeichen 61Globale JavaScript-Objekte

Boolean 123Date 123, 136–139Einführung 121, 123Math 123Number 123Regex 123String 123, 128–130

Globaler Gültigkeitsbereich 98go() (history-Objekt) 426Google Maps-API 441–446Großbuchstaben 128–130Groß- und Kleinschreibung 56Gruppierungsoperator 97:gt() (jQuery-Selektor) 340Gültigkeitsbereich 98, 457

Global 453IIFEs 97Lexikalisch 457Lokal 453Lokal (Funktionsebene) und global 98Namenskonflikte 99Variablen, Namenskonflikte 523

H:has() (jQuery-Selektor) 338hasAttribute() (DOM-Methode) 232–233.hasClass() (jQuery-Methode) 365hashchange 286.height() (jQuery-Methode) 348, 350height (screen-Objekt) 124.hide() (jQuery-Methode) 364, 493, 512–513, 542Hilfsfunktionen 570–571history (Browser Object Model) 124–125history-Objekt 424–427

Eigenschaften, length 426Methoden

back() 426forward() 426go() 426pushState() 426replaceState() 426

Hoisting 456.html() (jQuery-Methode) 314HTML 9

Attribute 9Elemente 9

HTML5APIs 413

Ortungs-API 416–419Verlaufs-API 424–427Webspeicher-API 420–423

Attributedata-* 608required 607

data-Attribute 289Ereignisse 286Formulare

placeholder 594–595Polyfills 593–595Steuerelemente 590–591Unterstützung und Gestaltung 592

Polyfills, Modernizr + YepNope 596–597HTML-Inhalte hinzufügen/entfernen

innerHTML (DOM-Eigenschaft) 218innerHTML und DOM-Bearbeitung 218–225jQuery 346removeChild() (DOM-Methode) 224Vergleich der Techniiken 226–227

Iid (DOM-Eigenschaft) 232if-Anweisungen 160–163, 181if... else 149, 162–163IIFEs 504, 523:image (jQuery-Selektor) 342Implizite Iteration 310Implizite Typumwandlung 166, 168.index() (jQuery-Methode) 565Indexnummern 129indexOf() (String-Objekt) 128–130, 550–553Inhalte hinzufügen, Vergleich der Techniken 226–227Inhaltsfelder

Beispiele 489Bildanzeige 506–513Diashow 515–520Modale Fenster 500–505Registerkarten 496–499Ziehharmonika 492–495, 522–525

Inhaltsschicht 44initialize 542Inkrementierung in Schleifen 171Inline-Skripts 49.innerHeight() (jQuery-Methode) 348innerHeight (window-Objekt) 124–125innerHTML (DOM-Eigenschaft) 218, 220–221, 227

Security risks 228innerText (DOM-Eigenschaft) 216–217.innerWidth() (jQuery-Methode) 348innerWidth (window-Objekt) 124–125:input (jQuery-Selektor) 342input (Ereignis) 247, 271, 280, 282, 552–553, 573, 588–589insertBefore() (DOM-Methode) 222, 240Instanzen (von Objekten) 109Integrierte Objekte 120–123

InterpreterDefinition 40Funktionsweise 452–457

.is() (jQuery-Methode) 343, 521, 565isNaN() (Number-Objekt) 132$.isNumeric() 343item() (Knotenliste) 196

JJavaScript

Deaktiviert 491Geschichte/Standards 532

JavaScript-Bibliotheken 360JavaScript-Konsole 464–465jQuery

$(function() { ... }); 313Ajax

$.ajax() 398–399.always() 396–397.done() 396–397.fail() 396–397Anforderungen 389Antworten 388Formulare abschicken 394–395$.getJSON() 396–397jqXHR-Objekt 405Kurzmethoden 392–393

$.get() 393$.get() 392$.getJSON() 392$.getScript() 392$.post() 392

.load() 390–391, 407, 427

.post() 394–395API 358Auswahl zwischenspeichern 308–309Daten mit Angular laden 438Dokumentation 358Download 298Downloadadresse 313, 354–357Durchlaufen von Elementen (implizite Iteration) 310Durchlaufen von Elementen mit .each() 324Einführung 294, 296

Beispiel 298–299Einschließen 354–355Elemente auswählen und ändern 314–316event-Objekt 326–331.fn-Objekt 523Formulare, .serialize() 394Globale Methoden

$.ajax() 388, 405$.get() 388$.getJSON() 388, 405$.getScript() 388$.isNumeric() 343$.post() 388, 394–395$.ajax() 398–399$.getJSON() 396–397

Implizite Iteration 310

jQuery-Auswahl 296–297, 306Anzahl der Elemente (length) 364Caching 307–308Hinzufügen 340

jQuery() (siehe auch $()) 296, 299jQuery UI 429–434

Formulare 432–433Registerkarten 431Ziehharmonika 430

Konflikte mit anderen Skripts 361Methoden

Grundlagen 297, 307Übersichtstabelle 304.add() 531.addClass() 320, 512–513, 519.after() 318, 535.always() 396–397.done() 396–397.fail() 396–397.animate( 365.animate() 493, 521.append() 318, 565.appendTo() 505, 519.attr() 320, 512–513.addClass() 498.attr() 498.find() 498.parent() 498.removeClass() 498.before() 318.children() 336.click() 512–513.clone() 346.closest() 336.css() 322, 510–511, 521.data() 546–547, 565, 602, 608–609.delay() 364.detach() 346, 502–503, 505.each() 324, 531, 546–547.empty() 346, 505.eq() 512–513.eq() 521.is() 521.fadeIn() 365.fadeOut() 510–511.fadeTo() 510–511.filter() 343, 531, 548.find() 336, 519, 565.focus() 619.hasClass() 365.hasOwnProperty() 565.height() 348, 350.hide() 364, 493, 512–513, 542–543.html() 314.index() 565.innerHeight() 348.innerWidth() 348.is() 343.load() 388.next() 336

.nextAll() 336

.not() 495, 531

.off() 505

.offset() 351

.on 364

.on() 326, 330, 343

.outerHeight() 348

.outerWidth() 348

.parent() 336

.parents() 336

.position() 351

.prepend() 318

.preventDefault() 328, 365, 495, 505

.prop() 619

.ready() 312, 364

.remove() 316, 346

.removeAttr() 320

.removeClass() 320

.replaceWith() 316

.scrollLeft() 350

.scrollTop() 350

.serialize() 394

.show() 364, 493, 542–543

.siblings() 336

.slideToggle() 495

.stop() 510–511

.stopPropagation() 328

.text() 314, 364, 535

.toArray() 531

.toggle() 493

.toggleClass() 565

.unwrap() 346

.val() 343, 345, 365, 543Verketten 311.width() 348, 350

Plug-Ins 359, 428Datumsauswahl 619noUISlider 538Selbst erstellen 522–525

Satz übereinstimmender Elemente 297, 306Seite zur Bearbeitung bereit 312–313Selektoren

:button 342:checkbox 342:checked 342:contains() 338:disabled 342:enabled 342:file 342:focus 342Grundlagen 296, 300:has() 338:image 342:input 342:not() 338:password 342:radio 342:reset 342:selected 342:submit 342

:text 342Übersichtstabelle 302–303

Versionen 298, 301Vorteile 300

jqXHR-Objekt 389, 405Eigenschaften

responseText 389responseXML 389status 389statusText 389

Methoden.abort() 389.always() 389.done() 389.fail() 389.load() 390–391overrideMimeType() 405

JSONAjax-Datenformat 374Debugging 474Einführung 376JSON-Daten 377JSON-Daten anzeigen 382–383JSON-Objekt 377

Deserialisierung 382parse() 377, 382Serialisierung 382stringify() 377, 382

KKarten (Google Maps) 441–446keydown 246, 280, 573keypress 246, 280, 573keys 533keyup 246, 280, 573Kleinbuchstaben 128–130Knoten 40Knotenlisten 196–197Kommentare 57Konsole

assert() 475debugger 479error() 472group() 473groupEnd() 473Haltepunkte 476–478info() 472log() 470–471table() 474warn() 472

Konstruktorschreibweise 106–111, 113Kontrollkästchen 580–581Koordinaten (Ortungs-API) 418Kurzgeschlossene Auswertung 157, 169

LLänge von Texteingaben 588–589lastChild (DOM-Eigenschaft) 208, 211lastIndexOf() (String-Objekt) 128–130

LeistungAuswahl von class- und id-Attributen (jQuery und DOM

im Vergleich) 324Ereignisdelegierung 266, 268Globale und lokale Variablen 99Platzierung von Skripts 356–357Zwischenspeicherung

Benutzerdefiniertes Text-Objekt 551Bilder 510–511DOM-Abfragen 190DOM-Knoten 575jQuery-Auswahl 308Objektverweise 540

length (Auswahlfelder) 584length (history-Objekt) 124, 426length (String-Objekt) 128–130, 588–589Lexikalischer Gültigkeitsbereich 457Lexikografische Sortierung 554Links

Angeklickten Link ermitteln 498Wert ders href-Attributs abrufen 407

Literalschreibweise 102, 104–105, 113Live-Suche 370.load() (jQuery-Methode) 388, 390, 407, 427load (Ereignis) 246, 272–273localStorage 420–423location (window-Objekt) 124–125Logische Operatoren 156

Kurzgeschlossene Auswertung 157, 169Logisches AND 157–158, 537Logisches NOT 157, 159Logisches OR 157, 159

Lokaler Gültigkeitsbereich 98:lt() (jQuery-Selektor) 340

Mmap() (array-Objekt) 530Math 134–135

EigenschaftenPI 134

Methodenceil() 134floor() 134random() 134round() 134sqrt() 134

Meldungsfeld 125Memberoperator 50, 103method (DOM-Eigenschaft) 572Methoden

Aufrufen 50Einführung 32–33, 100–101

Minifizierung 298.min.js 298

Modale Fenster 500–505Modernizr 415, 593, 596–597Modul-Muster 501mousedown 246, 276mousemove 246, 276

mouseout 246, 276mouseover 246, 276mouseup 246, 276multiple (DOM-Eigenschaft) 584MVC 434–439MVC / MV* 360

Nname (DOM-Eigenschaft) 572–573Namenskonflikte 97, 99Name/Wert-Paare 28, 88–89, 101NaN 461, 483navigator-Objekt 418new (Objekte) 106, 109.next() (jQuery-Methode) 336, 495.nextAll() (jQuery-Methode) 336nextSibling (DOM-Eigenschaft) 208, 210Nicht blockierende Verarbeitung 371Nicht vertrauenswürdige Daten 228nodeValue (DOM-Eigenschaft) 214, 241.not() (jQuery-Methode) 495, 531:not() (jQuery-Selektor) 338noUiSlider 538novalidate 591Number (integriertes Objekt)

MethodenisNan() 132toExponential() 132toFixed() 132toPrecision() 132

Runden 133Numerischer Datentyp 62

OObject() 106Objekte

Arrays aus Objekten 533Arrays in Objekten 119Beziehung zwischen Eigenschaften, Methoden und

Ereignissen 34–35Eigene Objekte erstellen

Bildcache 509–513Modale Fenster 501–504Schlagwörter 544–549Vergleichsfunktionen 562

Eigenschaften 100–101Ändern 107Auf leeren String setzen 107Entfernen 107, 112Hinzufügen und entfernen 112

Einführung 28–29, 100–101Erstellen

Date-Objekte 137Instanzen 109Konstruktorschreibweise 106, 108–111Literalschreibweise 102, 104–105Mehrere Objekte 105

Konstruktorschreibweise 108–109, 111Vergleich der Techniken 113

In Arrays 533Integrierte Objekte 120–121keys 533Literalschreibweise 586Methoden 100–101

Argumente 109Methoden (Einführung) 32–33Objekte als Eigenschaften von Objekten 533Objekt für gültige Formularelemente 601Schlüssel 101this 114–115Unterschiede zu Variablen und Arrays 116–117Zugriff

Eigenschaften (eckige Klammern) 103, 107Punktschreibweise 103–105, 110

Objektmodelle 121.off() (jQuery-Methode) 505.offset() (jQuery-Methode) 351.on() (jQuery-Methode) 326, 330, 343, 364, 498onpopstate (window-Objekt) 426open() (XMLHttpRequest-Objekt) 373Operatoren

+= 125+= Anhängen an einen String 111== Gleich 150>= Größer oder gleich 151() Gruppierungsoperator 97< Kleiner als 151<= Kleiner oder gleich 151. Memberoperator 103Memberoperator 50=== Strikt gleich 150!== Strikt ungleich 150? : Ternärer Operator 562, 579, 583Unäre Operatoren 168!= Ungleich 150Vergleichsoperatoren 150–151

<option> 584options (DOM-Eigenschaft) 584Ortungs-API 416–419.outerHeight() (jQuery-Methode) 348.outerWidth() (jQuery-Methode) 348.overrideMimeType() (jqXHR-Objekt)# 405

PpageXOffset (window-Objekt) 124–125pageX (window-Objekt) 278pageYOffset (window-Objekt) 124–125pageY (window-Objekt) 278Parameter 50, 88, 92–93

Ereignislistener 257.parent() (jQuery-Methode) 336, 498parentNode (DOM-Eigenschaft) 208.parents() (jQuery-Methode) 336:password (jQuery-Selektor) 342paste (Ereignis) 247Photo viewer 506–513PI (Math-Objekt) 134

placeholder 594Polyfills 593, 596–597pop() (array-Objekt) 530.position() (jQuery-Methode) 351Position-Objekt (Ortungs-API) 418–419PositionError-Objekt (Ortungs-API) 418–419Position von Elementen auf der Seite 352$.post() (jQuery-Methode) 388, 392, 394–395.prepend() (jQuery-Methode) 318.preventDefault() (jQuery-Methode) 328, 365, 495, 505preventDefault() (event-Objekt) 262, 267, 283,603, 605previousSibling (DOM-Eigenschaft) 208, 210Primitive Datentypen siehe Einfache (primitive) DatentypenProgrammgesteuerte Vorgehensweise 21.prop() (jQuery-Methode) 619Protokollunabhängige URLs 355Proxy (Ajax) 384Punktschreibweise 103push() 519push() (array-Objekt) 530, 540, 542–543pushState() (history-Objekt) 424–427

QquerySelectorAll() (DOM-Methode) 126, 193, 197querySelector() (DOM-Methode) 193–194, 202, 241

R:radio (jQuery-Selektor) 342random() (Math-Objekt) 134RangeError 459, 461.ready() (jQuery-Methode) 364ReferenceError 459–460Registerkarten 431, 496–499Reguläre Ausdrücke 563, 611Relative URLs (Ajax) 389.remove() (jQuery-Methode) 316, 346remove() 584removeAttribute() (DOM-Methode) 232, 235.removeAttr() (jQuery-Methode) 320removeChild() (DOM-Methode) 224–225.removeClass() (jQuery-Methode) 320, 512–513removeEventListener() (DOM-Methode) 255replace() (String-Objekt) 406replaceState() (history-Objekt) 424–427replace() (String-Objekt) 128–130, 563.replaceWith() (jQuery-Methode) 316Require.js 593:reset (jQuery-Selektor) 342reset() (DOM-Methode) 572reset (Ereignis) 247, 572resize (Ereignis) 246, 272responseText (XMLHttpRequest-Objekt) 379, 383responseXML (XMLHttpRequest-Objekt) 380return 94–95, 523, 579, 587reverse() (array-Objekt) 530round() (Math-Objekt) 134Runden von Zahlen 133, 135

SSame Origin Policy 420Sammlungen

elements 572, 600Knotenlisten 196

Satz übereinstimmender Elemente (jQuery) 297, 306Schieberegler 538Schleifen

Arrays durchlaufen 175, 530, 535break 174continue 174DOM-Elemente durchlaufen 204, 594–595

Beispiel 241Diagramm 206–207

do-while-SchleifenEinführung 170Verwenden 177

each() (jQuery-Methode) 324Eigenschaften eines Objekts durchlaufen 605Einführung 170–177Einführung (Diagramm) 172–173Endlosschleifen 174for-Schleifen 175

Diagramm 172Einführung 170Elemente durchlaufen 207

Inkrement (++) 171jQuery

.each() 324Implizite Iteration 310

Kontrollkästchen durchlaufen 580–581Leistung 174Optionsschalter durchlaufen 582–583while-Schleifen 176, 181

Einführung 170Zähler

Schlüssel (Objekte) 101Schlüssel/Wert-Paare 118Schlüsselwörter

break 165, 174case 165catch 480–481, 576–577continue 174, 595debugger 479delete 107, 112, 533finally 480–481new (Objekt) 106, 109return 94–95, 523, 579, 587switch 165this 108, 114–115, 270, 324throw 482try 480–481, 576–577var 60

Schwache Typisierung 166screen (Browser Object Model) 124–125

Eigenschaftenheight 124width 124

screenX (window-Objekt) 124, 278screenY (window-Objekt) 124, 278<script> 47

Bedingtes Laden 596–597Platzierung 48, 51Platzierung des <script>-Tags 313, 354–357

scroll (Ereignis) 246, 272.scrollLeft() (jQuery-Methode) 350.scrollTop() (jQuery-Methode) 350<select> 584select() (DOM-Methode) 573:selected (jQuery-Selektor) 342selected (DOM-Eigenschaft) 573, 582–583selectedIndex (DOM-Eigenschaft) 584selectedOptions (DOM-Eigenschaft) 584select (Ereignis) 247send() (XMLHttpRequest-Objekt) 373Serialisierung 382.serialize() (jQuery-Methode) 394sessionStorage 420–423setAttribute() (DOM-Methode) 232, 234setDate() (Date-Objekt) 137setFullYear() (Date-Objekt) 137setHours() (Date-Objekt) 137setItem() (Speicher-API) 421–423setMillseconds() (Date-Objekt) 137setMinutes() (Date-Objekt) 137setMonth() (Date-Objekt) 137setSeconds() (Date-Objekt) 137setTime() (Date-Objekt) 137setTimeout() (window-Objekt) 517, 519shift() (array-Objekt) 530.show() (jQuery-Methode) 364, 493.siblings() (jQuery-Methode) 336, 549Sicherheit

Cross Site Scripting (CSS) 228–231Skripts

Beim Laden der Seite ausführen 273Platzieren 356Schreiben 16–17

.slideToggle() (jQuery-Methode) 495some() (array-Objekt) 530sort() (array-Objekt) 530, 554Sortierung 555–566

Datumsangaben 559Lexikografisch 554Tabellen 561–566Zahlen 558Zufällige Reihenfolge 558

Speichern eines Skripts 46Speichern von Daten (Vergleich der Techniken) 116–117Speicherobjekte (Speicher-API) 420split() (String-Objekt) 128–130, 563, 546–547sqrt() (Math-Objekt) 134src 47Stack 454.stop() (jQuery-Methode) 510–511.stopPropagation() (jQuery-Methode) 328stopPropagation() (event-Objekt) 262, 267

String-ObjektEigenschaften

length 128–130Indexnummern 129Methoden

charAt() 128–130indexOf() 128–130, 552–553lastIndexOf() 128–130replace() 128–130, 563split() 128–130, 563, 619substring() 128–130toLowerCase() 128–130, 552–553toUpperCase() 128–130trim() 128–130, 552–553

Strings 62Text suchen 552

Stufenweise Erweiterung 45:submit (jQuery-Selektor) 342submit() (DOM-Methode) 572submit (Ereignis) 247, 271, 282, 572substring() (String-Objekt) 128–130.success() (jQuery-Methode) 396Suche 550–553switch-Anweisungen 164–165, 291Switch-Wert 165Synchrone Verarbeitung 371SyntaxError 459–460

TTabellen

Sortieren 561–566Zeilen hinzufügen 542–543

.tabs() (jQuery UI) 431target (event-Objekt) 262Tastaturereignisse 280Teilweise Aktualisierung einer Seite 371Templates 360, 434–439Ternärer Operator 562, 579, 583test() 611.text() (jQuery-Methode) 314, 364, 535:text (jQuery-Selektor) 342Text

Suchen 550–553<textarea> 588textContent (DOM-Eigenschaft) 216–217Textknoten

createTextNode() 126Erstellen 222, 240

this 108, 114–115, 324throw 482Timer 517.toArray() (jQuery-Methode) 531toDateString() (Date-Objekt) 137toExponential() (Number-Objekt) 132toFixed() (Number-Objekt) 132.toggle() (jQuery-Methode) 493.toggleClass() (jQuery-Methode) 565toLowerCase() (String-Objekt) 128–130, 550–553toPrecision() (Number-Objekt) 132

toString() (Date-Objekt) 137toTimeString() (Date-Objekt) 137toUpperCase() (String-Objekt) 128–130, 406Trennung der Aspekte 490trim() (String-Objekt) 128–130, 552Truthy und falsy 167try 480–481, 576–577type (DOM-Eigenschaft) 573TypeError 459, 461type (event-Objekt) 262

UUML (Unified Modeling Language) 494undefined 61Unix-Zeit 136–137unload (Ereignis) 246, 272Unmittelbar aufgerufene Funktionsausdrücke (IIFE) 97unshift() (array-Objekt) 530.unwrap() (jQuery-Methode) 346URIError 459–460URL (aktuellen URL abrufen) 124

V.val() (jQuery-Methode) 343, 345, 365, 543Validierung 282value (DOM-Eigenschaft) 573var 60Variablen

Definition 58Deklaration 60Flags 578–579Gültigkeitsbereich 98, 453

Global 98Lokal (Funktionsebene) 98

Namen 60Namenskonflikte 97, 99undefined 61Unterschiede zu Arrays und Objekten 116–117Werte zuweisen 61Zuweisungsoperator 61

Vergleichsfunktionen 555–559Vergleichsoperatoren 150–153

Ausdrücke vergleichen 154Gleichheit prüfen 168Operanden 152Truthy und falsy 167

Verhaltensschicht 44Verkettung (jQuery-Methoden) 311Verknüpfung mit einer JavaScript-Datei 47Verlaufs-API 424–427Verlaufsstapel 424Verweise

Auf Elemente 540Auf Objekte 540DOM 191Elemente in jQuery 308

WWebspeicher-API 420–423Weißraum (DOM) 209–211while-Schleifen 176, 181.width() (jQuery-Methode) 348, 350width (screen-Objekt) 124window (Browser Object Model) 124–125

EigenschafteninnerHeight 124innerWidth 124pageXOffset 124pageYOffset 124screenX 124screenY 124

Methodenalert() 124open() 124print() 124

window-ObjektEinführung 36–37location 36onpopstate 426

write() 226write() (document-Objekt) 126

XYXDomainRequest-Objekt (IE8-9) 384XML 374–375

XML-Daten mit Ajax laden 380–381XMLHttpRequest-Objekt 372

EigenschaftenresponseText 379, 383responseXML 380status 373, 378–379

open() 373send() 373

XSS (Cross Site Scripting) 228–231YepNope.js 596–597

ZZahlen 62

Runden 135Sortieren 558Zufallszahlen 135

Zeichenzähler 588–589Zentrieren 511Ziehharmonika 430, 492–495, 522–525Zufallszahlen 135Zuweisungsoperator 61, 107Zwischenspeichern

Bilder 509–511DOM-Abfragen 190–191DOM-Knoten 575jQuery-Auswahl 308–309, 540–541Objektverweise 540–541