在数据表中添加新行时，如何向元素<td>标签添加数据属性？

问题描述

我正在使用JavaScript并在JavaScript函数内部添加新行，我想在创建行时向其添加属性和类名：

Future<String> _uploadImage(File file,int number,{String extension = 'jpg'}) async {

    String result;

    if (result == null) {
      // generating file name
      String fileName =
          "$number$extension\_${DateTime.Now().millisecondsSinceEpoch}.$extension";

     
      AwsS3 awsS3 = AwsS3(
          awsFolderPath: awsFolderPath,file: selectedFile,fileNameWithExt: fileName,poolId: poolId,region: usEast1,bucketName: bucketName);



      setState(() => isFileUploading = true);
      displayUploadDialog(awsS3);
      try {
        try {
          result = await awsS3.uploadFile;
          debugPrint("Result :'$result'.");
        } on PlatformException {
          debugPrint("Result :'$result'.");
        }
      } on PlatformException catch (e) {
        debugPrint("Failed :'${e.message}'.");
      }
    }
    Navigator.of(context).pop();
    return result;
      }

上面您可以看到我将如何更新已有的属性，但是如何首先创建它们？

更新： 我首先需要为每一行创建classNames，因为稍后我需要通过类名查找标签。那么在创建行时如何给他们提供类名？

解决方法

要将隐藏的数据信息添加到行中，可以使用data()函数：

var rowNode = myTable.row
  .add([results.location_id,location_name.value,location_streetname.value,add_loc_hotline_phone])
  .data({city: location_city.value,streetname: location_streetname.value})
  .draw().node();

要添加类，您可以使用createdCell回调：

$('#container').dataTable( {
  // ...
  "columnDefs": [ {
    "targets": 0,// First column
    "createdCell": function (td,cellData,rowData,row,col) {
      td.classList.add(`column-id`);
    }
  } ]
} );