Question

我试图弄清楚为什么在添加数据属性时（让我们说一个图像）需要将属性名称放入引号中。我知道这需要做，但如果一个学生问我，我不会得到确切的答案。所以请看下面的两个例子。

1。）我正在寻找解释为什么短跑是一个问题的解释 2.）有没有办法逃避它，所以你不需要把它放在引号中？

这不起作用

$("img").attr({
    alt: "a picture of my cat",
    data-item : "pet",
    data-color : "orange",
});

这有效吗

$("img").attr({
    alt: "a picture of my cat",
    'data-item' : "pet",
    'data-color' : "orange",
});

3.。）传递给attr（）方法的参数是对象文字对吗？ 4.）这只是对象文字语法中的规则，不允许破折号吗？

Answer 1

1。）在对象文字中，-符号不允许作为标识符，因为它也是javascript中的减号运算符。

2。）不，你必须使用引号。

3。）是的。

4。）是的，见1。

Answer 2

我同意@Ferdi265。

然而，我要提出的另一点是使用jQuery.data()。

jQuery.data()实际上并不更新DOM，它会更新引用该元素的javascript对象并将值存储在那里。

性能要好得多，因为不需要DOM操作。

$("img").attr({
    alt: "a picture of my cat"
}).data({
    item: "pet",
    color: "orange"
});

显然，这不会更新元素的属性，因此将来必须使用jQuery.data()完成对这些值的任何引用;

$("img").data("item");

如果你有兴趣了解它是如何工作的，我会在一段时间后写一篇文章：

Answer 3

这就是我解决这个问题的方法：

.attr({ style: "font-size : 50px;background-color : powderblue;font-family:arial" })

作为如何在元素创建语句中指定多个属性的具体示例。这是在上述例子不起作用之后。