jQuery attr（）方法添加双引号而不是单引号

Question

我试图在运行时使用Jquery将以下代码添加到具有id =“ container”的div中

data-flickity='{ "autoPlay": 1000 }'

我正在使用attr（）方法来完成工作：

$('#container').attr("data-flickity",'{ "autoPlay": 500 }');

现在的问题是HTML的最终结果是该属性的值被用双引号而不是单引号引起来，

data-flickity="{ "autoPlay": 1000 }"

并且由于这个原因，我的网页无法正常工作。

因此，有人知道如何告诉attr（）方法添加单引号或通过其他任何方式实现使用单引号实现属性添加吗？

编辑：Here's a Codepen至我要实现的目标。由于无法访问HTML，因此我试图使用JS添加属性。

Answer 1

为什么不简单地在内部而不是外部使用单引号呢？

字符串{ 'autoPlay': 500 }传递给浏览器...而不是其引号。

$('#container').attr("data-flickity","{ 'autoPlay': 500 }");
console.log( $('#container').attr("data-flickity") );

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="container">container</div>