jquery Attribute erhalten

Question

Ich bin auf der Suche nach einer Möglichkeit, die benutzerdefinierten Attribute eines Elements mit jquery zu greifen.

<span id='element' data-type='foo' data-sort='bar'></span> 

Ich bin auf der Suche zu bekommen: ["data-type", "data-sort"] als Array.

Wer weiß, wie man das macht?

Danke.

Answer 1

können Sie die .attributes DOM property und Schleife verwenden, um durch, wie folgt aus:

var arr = document.getElementById('element').attributes, attributes = []; 
//or if you're inside a jQuery loop, just use this.attributes 
//e.g.: var arr = $("span").get(0).attributes, attributes = []; 
for(var i = 0; i < arr.length; i++) { 
    if(arr[i].name.indexOf("data-") == 0) //only ones starting with data- 
    attributes.push(arr[i].name); 
} 
alert(attributes); ​//use it for something, result is ["data-type", "data-sort"] 

You can see a working demo here, abgesehen von dem Element greifen, das überhaupt nicht jQuery spezifisch ist, so dass Sie es leicht vollständig bei Bedarf entfernen können.

Answer 2

nur einfach $('#element').attr('data-type'); und $('#element').attr('data-sort');

sorry, beantwortet, bevor die ganze Frage lesen: -/glaube nicht, dass ein in der Funktionalität eingebaut ist, sie als ein Array zu bekommen, die ersten erhalten, die zweiten und dann bauen das Array manuell.

Answer 3

Gerade als Referenz für die Verwendung von jQuery, Attribute beginnend mit ‚Daten-‘ kann durch die data() Funktion aufgerufen werden:

<span id='element' data-type='foo' data-sort='bar'></span> 

var el = $('#element'); 
return [el.data('type'), el.data('sort')]; 

Einige Browser beginnen, diese in fortgeschritteneren Möglichkeiten (lokale Datenspeicher zu speichern?) und andere nicht, aber es scheint ziemlich gut zu funktionieren. Beachten Sie, dass W3C-Validatoren solche Expandoattribute nicht mögen, aber ich denke, es gibt einige Vorschläge, dies zu standardisieren, damit sie validieren. Das letzte Mal, als ich nach der besten Methode zur Speicherung von Daten mit einem Element recherchierte, war die Verwendung von data-key einer der Gewinner unter Profis.

Eine andere Art, wie ich über lief Daten auf ein Element zu binden ist sofort ein Skript-Tag eingefügt werden vor oder nach dem Element, das einen anderen Typ als text/javascript wie geben:

<script id="templatedata" type="text/html"> 
    <span>23</span> 
    <span>Alfred</span> <!-- I'm sure you can get more creative than I'm being here --> 
</script> 

Dies wird nicht angezeigt im Browser, und Sie können immer noch das HTML dort über $('#templatedata').html(); bekommen. Dies kann immer noch seine Probleme haben, da es technisch nicht korrekt ist, aber wenn W3C HTML-Validierung für Sie wichtig ist, könnte es eine praktikable Option sein.

Answer 4

Sie können diesen Code verwenden, es ist sehr einfach zu suchen. Nur jquery nichts anderes .. Simple Jquery Filter