Zugriffselemente Attribute von verschiedenen Browser geben unterschiedliche Ergebnisse

Question

Ich versuche, einen (sehr einfachen) Test für den Zugriff auf HTML-Element-Attribute aus verschiedenen Browsern und die Ergebnisse sind unterschiedlich. Alles funktioniert in Chrome aber ... einfach drauf. Kein Firefox, keine Kante, kein IE und keine Safari. Das Problem ist, wie ich das Ergebnis bekomme, ich weiß, because var elements = document.querySelectorAll('input[data-request="2"]'); erstellt verschiedene Objekte. Zum Beispiel, mit Web-Inspektor, in Chrome habe ich Attributs-Tags, während in Edge nicht existiert (auch der Klassenname! Wird nicht angezeigt).

Ich brauche innerhalb einer Variablen Schleife und kann $(#obj).class('attrName') nicht verwenden. Um mich klar zu machen, machte ich ein JsFiddle Beispiel.

https://jsfiddle.net/BlackShawarna/qLxqtsqz/

Dank euch allen für die Hilfe

Answer 1

Ok, also herausgefunden ich nur die grundlegendsten, was ich versuchen könnte.

Using .getAttribute('nameAttr') made the trick. 

Answer 2

Geben Sie den folgenden Code ein kurzen,

$('input[data-request=2]').each(function(index){ 
    var className = $(this).attr("class"); 
    var selectID = className.split('_')[2]; 
    var selectName = className.split('_')[1]; 
    var value = $(this).attr('data-value'); //data-value 
    var rule = $(this).attr('data-rule'); //data-rule 
    var str = selectID + "\n" + selectName + "\n" + value + "\n" + rule + "\nElement Index " + index; 
    $("#result").append(str); 
    $("#result").append($('<br/>')); 
}); 

Dieser JavaScript-Code gibt gleiches Ergebnis sowohl in Chrome und Firefox.

Verwenden Sie die folgende HTML-Struktur:

<input class="hidden_1_4" type="hidden" data-request="2" data-value="0" data-rule="Equal" /> 
<input class="hidden_1_4" type="hidden" data-request="3" data-value="0" data-rule="NotEqual" /> 
<input class="hidden_1_5" type="hidden" data-request="2" data-value="0" data-rule="Equal" /> 
<div id="result"></div> 

JSFiddle