Question

如this question and answer中所述，可以使用适当的属性创建JQuery对象。例如：

jQuery('<div/>', {
    id: 'foo',
    href: 'http://google.com',
    title: 'Become a Googler',
    rel: 'external',
    text: 'Go to Google!'
}).appendTo('#mySelector');

作为其中的一部分，可以添加数据字段，以便您拥有：

jQuery('<div/>', {
    id: 'foo',
    data: ('meta', 'my-meta-data'),
    href: 'http://google.com',
    title: 'Become a Googler',
    rel: 'external',
    text: 'Go to Google!'
}).appendTo('#mySelector');

将在div＆＃39; foo＆＃39;中创建数据字段data-meta='my-meta-data'。

现在，如果我有一个对象

var my_data = {
    meta1: 'my-meta-data-1',
    meta2: 'my-meta-data-2'
}

在创建JQuery对象时，如何在数据字段中使用该对象？如果我可以说

那就太好了

jQuery('<div/>', {
    id: 'foo',
    data: my_data,
    href: 'http://google.com',
    title: 'Become a Googler',
    rel: 'external',
    text: 'Go to Google!'
}).appendTo('#mySelector');

但这太容易了。

注意：我虽然data: (key, value)有效，但我一直在尝试，但似乎并非如此。尽管如此，我的问题仍然存在。

Answer 1

试试这个：

jQuery('<div/>', {
    id: 'foo',
    data: { "my_data": my_data},
    href: 'http://google.com',
    title: 'Become a Googler',
    rel: 'external',
    text: 'Go to Google!'
}).appendTo('#mySelector');

var m1 = $("div").data("my_data").meta1;

改编@Vega的小提琴。 FIDDLE（注意：如果您更喜欢这种方法，那么没有“/ 1”的原始小提琴也会起作用。）

Answer 2

你的一个问题是为什么这不起作用：

data: ('meta', 'my-meta-data'),

您正在('meta', 'my-meta-data')表达式中使用逗号运算符。逗号运算符计算它的两个参数 - 在本例中为'meta'和'my-meta-data'，然后丢弃第一个参数，返回第二个参数。

鉴于这两个参数都是字符串常量，评估第一个参数不会做任何事情，所以你留下了等价的：

data: ('my-meta-data'),

或简单地说：

data: 'my-meta-data',

如你所知，这不是我们所需要的。

您可以在Chrome（或其他浏览器）开发者控制台中试验这些表达式。这是逗号表达式：

> ('meta', 'my-meta-data')
  "my-meta-data"

因此，如果我们尝试对象文字：

> { 'meta': 'my-meta-data' }
  SyntaxError: Unexpected token :

糟糕，由于JavaScript解析中的怪癖而无效：对象文字本身不会被识别为表达式。我们需要围绕它的括号（在大多数情况下，在实际代码中使用对象文字时不需要括号）：

> ({ 'meta': 'my-meta-data' })
  Object {meta: "my-meta-data"}

将多个数据传递给JQuery对象

2 个答案: