Question

我尝试进行（非常简单的）测试以从不同的浏览器访问html元素属性，结果不同。一切都适用于Chrome，但......就在它上面。没有Firefox，没有边缘，没有IE，没有野生动物园。

所以，问题是我如何得到结果，我知道，because var elements = document.querySelectorAll('input[data-request="2"]');创建了不同的对象。例如，使用网络检查器，在Chrome中，我在Edge中没有属性标记（即使没有显示className！）。

我需要在变量中循环，不能使用$(#obj).class('attrName')。为了使自己清楚，我做了一个jsFiddle示例。

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

感谢各位的帮助

Answer 1

好的，所以我想出了我可以尝试的最基本的东西。

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

Answer 2

将以下代码简称为

$('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/>'));
});

此JavaScript代码在Chrome和Firefox中都提供相同的结果。

使用以下HTML结构：

<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

来自不同浏览器的访问元素属性会产生不同的结果

2 个答案: