Il metodo .data() ci permette di leggere i dati precedentemente associati agli elementi DOM. Possiamo recuperare diversi valori distinti per un singolo elemento uno alla volta, o come set:
|
1
2
3
4
5
6
7
|
|
Chiamare .data() senza parametri restituisce un oggetto JavaScript contenente ogni valore memorizzato come proprietà. L’oggetto può essere usato direttamente per ottenere i valori dei dati (ma si noti che i nomi delle proprietà originariamente contenenti trattini saranno stati modificati come descritto di seguito).
Da jQuery 3, ogni sequenza di due caratteri “-” (U+002D) seguita da una lettera ASCII minuscola in una chiave viene sostituita dalla versione maiuscola della lettera, in linea con l’API HTML dataset. Una dichiarazione come $( "body" ).data( { "my-name": "aValue" } ).data(); restituirà { myName: "aValue" }.
HTML5 data-* Attributi
Da jQuery 1.4.3, gli attributi data-* sono usati per inizializzare i dati jQuery. Gli attributi data-* di un elemento vengono recuperati la prima volta che il metodo data() viene invocato su di esso, e poi non sono più accessibili o modificabili (tutti i valori sono memorizzati internamente da jQuery).
Ogni tentativo è fatto per convertire il valore stringa dell’attributo in un valore JavaScript (questo include booleani, numeri, oggetti, array e null). Una stringa viene convertita in un numero solo se ciò non cambia la sua rappresentazione (per esempio, la stringa “100” viene convertita nel numero 100, ma “1E02” e “100.000” vengono lasciati come stringhe perché il loro valore numerico di 100 si serializza in “100”). Quando una stringa inizia con ‘{‘ o ‘[‘, allora jQuery.parseJSON viene usato per analizzarla; deve seguire una sintassi JSON valida, inclusi i nomi di proprietà quotati. Una stringa non analizzabile come valore JavaScript non viene convertita.
Per recuperare un valore di attributo data-* come stringa non convertita, usare il metodo attr().
Da jQuery 1.6, i trattini nei nomi degli attributi data-* sono stati processati in linea con le API HTML dataset.
Per esempio, dato il seguente HTML:
|
1
|
|
I seguenti confronti sono tutti veri:
|
1
2
3
4
|
|