是否有一种简单/快速的方法将“数据”属性映射到混合大小写的属性名称？答案

【问题标题】：Is there a simple/fast way to map "data-" attributes to mixed-case property names?是否有一种简单/快速的方法将“数据”属性映射到混合大小写的属性名称？
【发布时间】：2014-12-18 15:31:17
【问题描述】：

我有一个基础插件类，用作我所有 jQuery 插件的基础。它与 jQuery UI 小部件类似，但对我来说完成了很多繁重的工作。

我现在希望将附加元素中的data- 属性值映射到传递给插件的任何选项中。这将允许插件不仅采用典型的options 对象，还允许对单个元素进行数据驱动的覆盖值（常见要求）。

我遇到的问题是我的选项属性通常是混合大小写，例如MaxHeight，但显然 HTML 规范只允许小写字符 进入 data- 属性名称。

以测试平台为例：http://jsfiddle.net/TrueBlueAussie/tfkrwq09/1/

HTML：

<div id="test" data-DataTest="test2"></div>

jQuery：

var object = {
    DataTest: 123
};
$.each($('#test').data(), function (k, v) {
    object[k] = v;
});

console.log(object.datatest); // test
console.log(object.DataTest); // 123

想要的结果：

console.log(object.datatest); // undefined
console.log(object.DataTest); // test

我正在寻找将data- 属性映射到大小写混合属性的方法，同时保持当前的速度和简单性（如果可能的话）。

【问题讨论】：

我根据 jQuery's doc for data() 中的示例进行了快速测试，似乎如果您自己设置数据，jQuery 将在写入时检索它。示例：$('#test').data({TEST: 1});，然后执行console.log(object.TEST);，您将得到1。
您必须使用连字符表示法：data-data-test="test2" 编辑：实际上不是DataTest，但这就是为什么属性名称不应该以大写字母开头的原因
这很有趣，没想到它是这样工作的。不仅大写字母似乎无效，而且它们“全部……自动变为小写字母”
类似这个问题：stackoverflow.com/questions/27359388/…
@A.沃尔夫：非常接近。 that's-a-great-solution...刚试过data--data-test，还得到了一个前导大写字符...请作为答案发布:)

标签： javascript jquery jquery-plugins custom-data-attribute

【解决方案1】：

有关驼峰式规则，请参阅以下链接：https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement.dataset

所以在你的情况下，我会使用：

<div id="test" data--data-test="test2"></div>

获得：

object.DataTest; //test2

【讨论】：

data--data-test 将提供我所需的领先资本（我猜它可能允许这样做并且它起作用了）。您可能需要修改。
我的 C# 倾向于使用 ProperCased 属性名称。不知道 JS 代码最广泛的标准是什么 :)
我看到的 C# 最常见的标准是 Property = ProperCased, Field = lowerFirst
@TrueBlueAussie 你是对的：msdn.microsoft.com/en-us/library/vstudio/…
...我可能需要修改我的编码以适应最常见的 JS 命名标准（来回切换很痛苦，因此非常喜欢 TypeScript）:)