通过ajax更新数据属性的问题

Question

我想通过ajax获取数据并更新div属性data-used，但它没有改变，在控制台中，它显示：

TypeError：“＃powerv1”.data不是函数

$.ajax({
  url: 'showjson.php',
  data: "power=10",
  dataType: 'json',

  success: function(datap){
    var p1value= datap.power;
    ('#powerv1').data('used',p1value);
    //('#powerv1').attr('data-used',p1value); <--also tested , same error
  }

});

<div class="card"><h5 class="card-header"> Area 1</h5>
  <h2 class="mb-0">
    <div class='Preview'>
      <div class='GaugeMeter' id='powerv1' name='powerv1' data-size='200' data-theme='Green-Red' data-width='15'data-append='W' data-label='Watt'_color='#FF0000' data-showvalue=true data-total=1000 data-used=100></div>
    </div>
  </h2>
</div>

Answer 1

From the docs:

使用data（）方法更新数据不会影响DOM中的属性。要设置data- *属性值，请使用attr。

$.ajax({
  url: 'showjson.php',
  data: "power=10",
  dataType: 'json',

  success: function(datap){
    console.log(JSON.stringify(datap)); // log the response to console.
    var p1value = datap.power;
    $('#powerv1').data('used',p1value);
    $('#powerv1').attr('data-used', p1value);
  }

});