jquery - jQuery 选择器和 HTML5 data-* 属性动态设置

Question

我有这个工作：

  <div data-people="australian">Australian people eats...</div>

  <script type="text/javascript">
    alert($("[data-people=australian]").html());
  </script>

但这另一个不起作用，我不知道如何解决：

  <div id="mich">Australian people eats...</div>

  <script type="text/javascript">
    $("#mich").data("people", "australian");

    alert($("[data-people=australian]").html());
  </script>

为什么我不能从 jQuery 设置 data-* HTML5 属性并使用它们来选择 DOM 对象？？？

非常感谢

Answer 1

jQuery data() 映射的data-属性是单向的。如果要实际设置节点上的属性，则应使用 attr() 函数。

$("#mich").attr("data-people", "australian");

从文档：

data- 属性在第一次访问 data 属性时被拉取，然后不再被访问或改变（然后所有数据值都存储在 jQuery 内部）