2010-02-08 4 views
41

So singoli attributi possono essere recuperati con il metodo attr(), ma sto cercando di iterare su tutte degli attributi per un elemento. Per contesto, sto usando jQuery su alcuni XML ...iterazione di attributi degli elementi con jQuery

<items> 
    <item id="id123" name="Fizz" value="Buzz" type="xyz"> 
    <subitem name="foo"> 
    <subitem name="bar"> 
    </item> 
    <item id="id456" name="Bizz" value="Bazz" type="abc"> 
    <subitem name="meh"> 
    <subitem name="hem"> 
    </item> 
</items> 

io sono già in grado di iterare gli elementi con ...

$(xml).find('item').each(function() { 
    // Do something to each item here... 
}); 

Ma mi piacerebbe essere in grado di ottenere una serie di attributi per ogni 'elemento' in modo da poter poi scorrere su quelli ...

ad es.

$(xml).find('item').each(function() { 
    var attributes = $(this).attributes(); // returns an array of attributes? 
    for (attribute in attributes) { 
    // Do something with each attribute... 
    } 
}); 

Ho fatto qualche ricerca qui, nella documentazione di jQuery, e altrove tramite Google, ma non hanno avuto fortuna. Se non altro, potrei avere problemi ad escludere i risultati relativi al metodo attr() dell'oggetto jQuery. Grazie in anticipo.

+1

Vedi http://stackoverflow.com/questions/1705504/javascript-jquery-how-do-i-get-an-array-of-all-attributes-in-an- xml-element –

risposta

94

Il modo migliore è utilizzare direttamente l'oggetto nodo utilizzando la proprietà attributes. L'unica differenza nella mia soluzione qui di seguito rispetto ad altri che suggeriscono questo metodo è che vorrei utilizzare .each di nuovo al posto di un ciclo tradizionale js:

$(xml).find('item').each(function() { 
    $.each(this.attributes, function(i, attrib){ 
    var name = attrib.name; 
    var value = attrib.value; 
    // do your magic :-) 
    }); 
}); 
+1

un codice così bello :) legge molto meglio del classico per –

+0

Grazie, questo ha fatto il trucco! – theraccoonbear

+0

@prodigalson: Grazie per questo approccio a un foreach indicizzato! –

9

sembra si deve utilizzare Plain Old javascript vaniglia:

for (var i = 0; i < elem.attributes.length; i++) { 
    var attrib = elem.attributes[i]; 
    if (attrib.specified == true) { 
     console.log(attrib.name + " = " + attrib.value); 
    } 
} 

How to iterate through all attributes in an HTML element?

+0

E non c'è niente di sbagliato in questo. attr() è un metodo di convenienza. –

0

ne dite?

$(xml).find('item').each(function() { 
    var attributes = $(this)[0].attributes; 
    for (attribute in attributes) { 
    // Do something with each attribute... 
    } 
}); 
3

potrebbe ottenere l'elemento DOM dall'involucro jQuery utilizzando la funzione get(), e poi iterare attribuisce il DOM?

var node = $(myStuff).get(0); 
if (node.attributes.length) { 

    for (var length = attrs.length, i = 0; i < length; i++) { 
     if (attrs[i].specified) { 

     } 
    } 
} 

Per una gestione degli attributi DOM molto più robusta, check this blog post.

0

Mentre si può semplicemente utilizzare l'attributo DOM elemento standard attributes, includerà ogni attributo (anche quelli non impostati in modo esplicito) in IE6. In alternativa, è possibile limitare il numero di attributi impostati:

var use_attributes = ['id','name','value','type']; 
$(xml).find('item').each(function() { 
    var $item = $(this); 

    $.each(use_attributes, function(){ 
    if($item.attr(this)){ 
     // Act on the attribute here. 
     // `this` = attribute name 
     // $item.attr(this) = attribute value 
    } 
    }) 
}); 
0

Vi metto qui perché penso che possa aiutare gli altri che arrivano a questo annuncio che cercano di analizzare un file XML come ero.

Ero alla ricerca di un metodo per attraversare un file xml con una struttura molto simile a quella di theracoonbear e memorizzare i risultati in un array e ho trovato questo post.

ho guardato il codice di prodigitalson ma semplicemente non ha potuto ottenere questa sintassi per lavorare - con Firefox lamentando che nella linea:

$.each(this.attributes, function(i, attrib){ 

che

questo.attributi

non è una funzione definita. Sono abbastanza sicuro che l'errore è interamente mio. Ma ho trascorso diverse ore cercando di ottenere questo lavoro e non sono riusciti

Che cosa ha funzionato per me era (dove il mio nome tag è seduta al posto del punto): -

$(xml_Data).find("session").each(function() { 
    console.log("found session"); 
    $(this).children().each(function(){ 
    console.log("found child " + this.tagName); 
    console.log("attributes" + $(this).text()); 
    }); 
}); 

mi rendo conto che questo non può esattamente rispondi alla domanda originale. Tuttavia spero che possa salvare qualche altro visitatore in questo post.

saluti

0
function findByAll(toLookFor, lookInText) { 
    return $('*').filter(function() { 
     return Array.prototype.some.call(this.attributes, function(attr) { 
      return attr.value.indexOf(toLookFor) >= 0; 
     }) || (lookInText && $(this).text().indexOf(toLookFor) >= 0); 
    }); 
}