Question

这是我的HTML

<a href="#" data-finder-code="" data-dropdown-placeholder="Select..." data-dropdown-text="1">Samsung</a>

这是我的JQuery

var finder_code = 39;
$("a[data-dropdown-text='1']").data("finder-code", finder_code);

当我按$("a[data-dropdown-text='1']")搜索并尝试替换同一data-finder-code中的href时，没有任何反应。我如何让这个工作？

Answer 1

您的代码运行正常。当您使用data()时，jQuery仅出于性能原因更新其内部缓存。如果您使用data()的getter检索值，那么您可以看到它正常工作：

var finder_code = 39;
$("a[data-dropdown-text='1']").data("finder-code", finder_code);

console.log($("a[data-dropdown-text='1']").data('finder-code'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" data-finder-code="" data-dropdown-placeholder="Select..." data-dropdown-text="1">Samsung</a>

如果更新DOM中的值，那么您可以使用attr('data-finder-code')，但速度稍慢：

var finder_code = 39;
$("a[data-dropdown-text='1']").attr('data-finder-code', finder_code);

Answer 2

jQuery在使用.data(key, value)时使用内部缓存来保留任意数据，它不会更新DOM。

否则您的代码将起作用。但是，如果要更新属性值，请使用.attr(key, value)

$("a[data-dropdown-text='1']").attr("data-finder-code", finder_code);

Answer 3

var finder_code = 39;
$("a[data-dropdown-text='1']").attr("data-finder-code", finder_code);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<a href="#" data-finder-code="" data-dropdown-placeholder="Select..." data-dropdown-text="1">Samsung</a>

请尝试将data("finder-code")替换为attr("data-finder-code")以获取DOM更新。

按数据属性搜索，并替换

3 个答案: