无法更新“数据属性”值

Question

上传栏需要更新，我认为一切都是真的，但我无法更新data-value 。

HTML代码：

<div id="Result_Success" class="progress-Bar" data-value="0"></div>

Javascript：

success: function (response) {
      $("#Result_Success").data('value', response["yuzdelik"]);
}

错误在哪里？

Answer 1

你需要

javascript $("#Result_Success").attr('data-value', response["yuzdelik"]);

Answer 2

另一种方法是直接访问元素的dataset属性以对其进行更改。 为此，您需要获取对原始DOM节点的引用，而不是由jQuery对象包装。 您可以通过使用jQuery的get方法$("#Result_Success").get(0)或使用jQuery的类似于数组的性质（通过$("#Result_Success")[0]来获取原始DOM节点，如本例中那样下面。

 function setResponse (response) { $("#Result_Success")[0].dataset.value = response["yuzdelik"]; } let val = 0; let timer = setInterval(function () { setResponse({yuzdelik: val}); if (val >= 100) { clearInterval(timer); } else { val += 25; } }, 500); 

 #prog { border: 1px #000 solid; } #Result_Success { height: 20px; background: #0f0; } #Result_Success[data-value="0"] { width: 0%; } #Result_Success[data-value="25"] { width: 25%; } #Result_Success[data-value="50"] { width: 50%; } #Result_Success[data-value="75"] { width: 75%; } #Result_Success[data-value="100"] { width: 100%; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="prog"> <div id="Result_Success" class="progress-Bar" data-value="0"></div> </div> 

使用$("#Result_Success").data()无效的原因是它实际上并未修改data- attribute。 jQuery在其内部存储带有.data数据集。 jQuery这样做不是为了避免循环引用而修改元素属性。 如今，对DOM元素的循环引用并不是什么大不了的事情，但是在IE更相关的时候，这是因为在IE的较旧版本（尤其是IE6）中，当您从DOM中删除该元素时，它们会导致内存泄漏 。

这可能确实令人困惑，因为jQuery会将所有data-属性拉入其自己的内部数据中 。 该文档指出：

数据属性在第一次访问数据属性时被提取，然后不再被访问或变异（所有数据值然后内部存储在jQuery中）。

Answer 3

错误在最后一行（不需要引号）：

$（“＃Result_Success”）。data（'value'，response.yuzdelik）;