与 javascript/jquery 中的属性访问器相关的奇怪行为

Question

我对 Chrome 和 Safari 有疑问：

代码示例：

// Get all links with the same data-test attribute
links = $('[data-test]');

//The issue is here:
// This only works in Chrome, not in safari.
var test = links[0].testProperty;

// This works in Chrome and Safari.
var test2 = $(links[0]).attr('testProperty');

console.log(test)
console.log(test2)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" testProperty="valueTest1" data-test>Test1</a>
<a href="#" testProperty="valueTest2" data-test>Test2</a>
<a href="#" testProperty="valueTest3" data-test>Test3</a>

为什么 Safari 不允许 links[0].testProperty ？

Answer 1

这里是你的答案https://*.com/a/15011028/7041168

按照标准，您需要在任何自定义属性之前使用date-。

而要改变问题，最好使用Element.getAttribute("")属性。

Answer 2

links[0] 是一个 DOM 元素对象，它没有 testPropety 属性。

chrome 和 safari 都不会定义该属性。