JavaScript  »  Guide  »  Guida jQuery 

Uno dei gruppi di metodi più potenti in jQuery è sicuramente quello relativo agli attributi. In generale il suo funzionamento prevede tre comportamenti in base agli argomenti passati:

• 1 argomento stringa: restuituisce il valure dell'attributo
• 2 argomenti stringa: imposta l'attributo
• 1 argomento stringa e una funzione: imposta l'attributo in base alla funzione passata
• 1 oggetto formato da coppie 'attributo' : 'valore' : imposta attributi multipli

Lavorare con gli attributi

Il metodo specifico per ricavare ed impostare gli attributi degli elementi è, molto sinteticamente .attr(), eccone alcuni esempi introduttivi:

$("a#mioLink").attr("href"); //restituisce il valore di href

$("a#mioLink").attr("href","http://www.html.it"); //imposta il valore di href

$("a#mioLink").attr("href",function () { ... }); //imposta il valore di href in base alla funzione

$("a#mioLink").attr({
   "href":"http://www.html.it"
   "target":"_blank"
}); //imposta il valore di href e del target

Nel caso di una funzione passata come secondo argomento è possibile impostare due argomenti come con .each(). Due esempi abbastanza completi di come si potrebbe utilizzare questo medoto sono i seguenti:

//raccogliere la lista degli URL da una serie di tag a

var ListaURL = []; //array di base

$("#menu li a").each(function (i,el) {
     ListaURL.push($(el).attr("href");
});

  //impostare il link di una serie di tag a in base alla posizione

var ListaURL = ["http://www.html.it","http://www.google.it","http://www.yahoo.it"];

$("#menu li a").attr("href",function (i,el) {
     return ListaURL[i];
});

Nel caso volessimo invece eliminare un attributo basterà utilizzare .removeAttr():

//rimuovere l'attributo target da tutti gli elementi della collezione
$("#menu li a").removeAttr("target");

Altri articoli

Altre guide

Altre newsletter