Question

我有一个带有预设数据属性data-data='{"type":"animal","items":"20"}'的div标签，该标签将由函数A（）处理。根据用户事件，应使用函数B（）向数据属性中添加更多内容，然后再使用函数A（）进行处理

<div id="getInfo" data-data='{"type":"animal","items":"20"}'></div>

function A() {
   var data = $('#getInfo').data('data');
   //send data to server
}

function B() {
   var long_lat = user_location_data();
   $('#getInfo').data('data');// add long_lat
}

数据属性中的信息将发送到服务器->查询数据库，如果用户允许我们获取其位置，则用户位置将被添加到数据属性中，即data-data='{"type":"animal","items":"20","long":"2.35640","lat":"0.35341"}'，然后将被处理，发送至服务器。

Answer 1

您可以通过执行以下操作将更多数据添加到数据属性：

$(document).ready(() => {
  var data = $('#getInfo').data('data');
  $('#getInfo').data('data', Object.assign(data, {
   long: 2.35640,
   lat: 0.35341
  }));
  
  console.log('newData', $('#getInfo').data('data'));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="getInfo" data-data='{"type":"animal","items":"20"}'></div>

如何将更多对象或数组添加到数据属性

1 个答案: