De .data() methode staat ons toe om data te lezen die eerder geassocieerd is met DOM elementen. We kunnen verschillende waarden voor een enkel element één voor één ophalen, of als een set:
|
1
2
3
4
5
6
7
|
|
Aanroepen van .data() zonder parameters levert een JavaScript-object op dat elke opgeslagen waarde als eigenschap bevat. Het object kan direct worden gebruikt om gegevenswaarden op te halen (maar merk op dat de namen van eigenschappen die oorspronkelijk streepjes bevatten, zullen zijn gewijzigd zoals hieronder beschreven).
Sinds jQuery 3 wordt elke reeks van twee tekens met “-” (U+002D) gevolgd door een ASCII-letter met kleine letters in een sleutel vervangen door de hoofdletterversie van de letter, in overeenstemming met de HTML-dataset-API. Een statement als $( "body" ).data( { "my-name": "aValue" } ).data(); zal { myName: "aValue" }.
HTML5 data-* Attributen
Sinds jQuery 1.4.3, worden data-* attributen gebruikt om jQuery data te initialiseren. De data-* attributen van een element worden de eerste keer dat de data() methode wordt aangeroepen opgehaald, en worden daarna niet meer benaderd of gemuteerd (alle waarden worden intern door jQuery opgeslagen).
Elke poging wordt ondernomen om de string waarde van het attribuut om te zetten naar een JavaScript waarde (dit omvat booleans, getallen, objecten, arrays, en null). Een string wordt alleen geconverteerd naar een getal als dit de representatie niet verandert (bijvoorbeeld, de string “100” wordt geconverteerd naar het getal 100, maar “1E02” en “100.000” blijven strings omdat hun numerieke waarde van 100 serialiseert naar “100”). Wanneer een string begint met ‘{‘ of ‘[‘, dan wordt jQuery.parseJSON gebruikt om hem te parsen; hij moet een geldige JSON syntaxis volgen, inclusief geciteerde namen van eigenschappen. Een string die niet parseerbaar is als een JavaScript waarde wordt niet geconverteerd.
Om een data-* attribuut waarde op te halen als een ongeconverteerde string, gebruik de attr() methode.
Sinds jQuery 1.6, streepjes in data-* attribuut namen zijn verwerkt in overeenstemming met de HTML dataset API.
Bijvoorbeeld, gegeven de volgende HTML:
|
1
|
|
De volgende vergelijkingen zijn allemaal waar:
|
1
2
3
4
|
|