Question

我正在尝试将数据属性添加到SaveSection锚点，但是它不起作用。在jQuery文档中，它显示了能够像我正在添加的那样添加数据属性，但是没有发生

$('#SaveSection').data("admin-section", "vendorcatalogs");

a {
 text-decoration: none;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
<ul>
  <li><a href="#" id="SaveSection"><i class="fa fa-floppy-o"></i>&nbsp; Save</a></li>
</ul>

Answer 1

您的代码运行正常。请注意，data()将值存储在jQuery保留在内存中的对象中，它不会更新DOM。只要您同时将data()用作getter 和设置器，逻辑就可以正常工作：

var $saveSection = $('#SaveSection').data("admin-section", "vendorcatalogs");
console.log($saveSection.data('admin-section'));

a { text-decoration: none; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<ul>
  <li>
    <a href="#" id="SaveSection">
      <i class="fa fa-floppy-o"></i>&nbsp; Save
    </a>
  </li>
</ul>

如果您仍然要求data属性出现在DOM中，请使用attr()而不是data()，但是请注意，这会比较慢：

var $saveSection = $('#SaveSection').attr("data-admin-section", "vendorcatalogs");
console.log($saveSection.attr('data-admin-section'));

a { text-decoration: none; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

<ul>
  <li>
    <a href="#" id="SaveSection">
      <i class="fa fa-floppy-o"></i>&nbsp; Save
    </a>
  </li>
</ul>

无法将数据属性添加到元素

1 个答案: