Question

我试图用jquery获取数据属性的内容，但返回的数据不是我设置的。

通过这个简单的例子：

<div id="test" data-test="[1]"></div>

但$('#test').data('test')会返回1而不是[1]

使用纯javascript没问题。

在线查看：https://jsfiddle.net/jojhm2nd/

Answer 1

jQuery的data不是属性访问器函数。（这是一个常见的错误，很容易做到。）要只访问该属性，请使用attr。

$("#test").attr("data-test");

data读取data-*属性，但仅用于初始化该元素的jQuery数据缓存。（它永远不会写属性。）它会执行一系列事情，包括更改名称（例如data-testing-one-two-three变为testingOneTwoThree）和解释值。在这种情况下，它将值解释为数组，因为它以[开头。当您使用alert显示该数组时，它会被强制转换为字符串，当您将数组强制转换为字符串时，会执行Array#join。例如，如果您的属性为[1, 2]，那么您已将1,2视为结果。

从上面链接的文档：

每次尝试都将字符串转换为JavaScript值（包括布尔值，数字，对象，数组和null）。如果这样做不会更改值的表示，则只将值转换为数字。例如，“1E02”和“100.000”等同于数字（数值100），但转换它们会改变它们的表示形式，因此它们将保留为字符串。字符串值“100”将转换为数字100。

当data属性是一个对象（以'{'开头）或数组（以'['开头）时，jQuery.parseJSON用于解析字符串;它必须遵循有效的JSON语法，包括引用的属性名称。如果该值不能作为JavaScript值进行解析，则将其保留为字符串。

Answer 2

使用.data方法时，jQuery会产生魔力。

来自jQuery网站：

每次尝试都将字符串转换为JavaScript值（这包括布尔值，数字，对象，数组和null）。

您可以使用.attr方法并执行：

$('#test').attr('data-test');

为什么jquery从数据html5属性中删除括号？

2 个答案: