jQuery camel-case映射从“data-”属性名称到“.data（）”键

Question

如果在元素上添加“data-”属性：

<div id='x' data-key='value'>

然后你可以通过jQuery“.data（）”方法获取值：

alert($('#x').data('key')); // alerts "value"

该库使用一致的camel-case转换器来处理带有嵌入破折号的属性名称：

<div id='x' data-hello-world="hi">

alert($('#x').data("helloWorld"));

camel-case转换器是一个jQuery“全局”函数：

alert($.camelCase("hello-world")); // alerts "helloWorld"

但是，当属性名称的名称包含由短划线包围的单个字母时，这一切都会失效：

<div id='x' data-image-x-offset='50px'>

alert($('#x').data('imageXOffset')); // undefined

这有点奇怪，因为：

alert($.camelCase('image-x-offset')); // "imageXOffset"

那有什么不对？我认为它与用于执行其他方向的机制有关，将已经驼峰式的名称转换回虚线形式。但我无法在代码中找到它。

1.6.2中似乎与1.6.3相同。 （顺便说一下，“image-x-offset”形式可用于获取数据。）

编辑 - 如果，对于给定的元素，您可以通过虚线形式访问尝试驼峰形式，然后它可以工作（这告诉我这个肯定是bug： - ）

Answer 1

你是对的。问题似乎在于它们用于从camelCase转换为虚线的正则表达式。

rmultiDash = /([a-z])([A-Z])/g;

... as used here：

var name = "data-" + key.replace( rmultiDash, "$1-$2" ).toLowerCase();

...导致：

data-image-xoffset

...而不是：

data-image-x-offset

演示： http://jsfiddle.net/TLnaW/

因此，当您使用虚线版本时，当它查找属性时，它会找到它而不需要转换，然后将camelCase版本添加到jQuery.cache中的元素数据。

随后的尝试将起作用，因为现在存在正确的camelCase，因此它不再尝试将其作为属性获取，因此不再需要错误的正则表达式。