Corsi on-line

Gestione dei microdati HTML5 con jQuery

I microdati sono dei nuovi elementi integrati nel markup HTML5 il cui scopo è in pratica quello di rendere visibili delle informazioni all’interno della SERP del motore di ricerca più grande della Rete; parliamo naturalmente di Google, per questo motivo i microdati sono considerati uno strumento vantaggioso per ottenere maggiore visibilità e, di conseguenza, maggiori occasioni per aumentare le visite verso un sito Internet.

Il framework JavaScript jQuery mette a disposizione alcuni strumenti per la gestione dei microdati, nello specifico facciamo riferimento a due metodi:

  1. attr(): che ricava il valore di un attributo per il primo elemento presente in una raccolta di elementi corrispondenti;
  2. data(): la cui funzione è quella di archiviare dati di tipo arbitrario associati con elementi corrispondenti.

Per fare un semplice esempio, potremmo prendere in considerazione questo semplice paragrafo:

<p id="prova" data-micro="I microdati in HTML5"></p>

Ora, sarà possibile rilevare il microdato presentato dal codice precedente utilizzando entrambi i metodi all’interno di una semplice funzione JavaScript:

$(function() {
var prova = $('#prova');
var con_metodo_attr = prova.attr('data-micro');
var con_metodo_data = prova.data('micro');
prova.text(con_metodo_attr + ', ' + con_metodo_data+ '.');
});

Il risultato del nostro codice sarà il seguente output:

I microdati in HTML5, I microdati in HTML5.

Se non fosse per i due segni di interpunzione aggiunti in concatenazione (“,” e “.”), non avremmo ottenuto altro che la medesima stringa ripetuta due volte, questo perché entrambi i metodi svolgono la stessa funzione per il recupero dei microdati; l’unica differenza tra essi è che “attr()” richiede la presenza di un prefisso (nel nostro caso “data”) che potrà invece non essere passato al metodo “data()”.

Post correlati
I più letti del mese
Tematiche