modern repeater pattern for ui elements?

modern repeater pattern for ui elements?

Hello, 10 years ago, the standard repeater pattern for UI elements, at least in the .NET world, was to use a unique id for each element. For example, a repeating list of myfield inputs, by default, would have unique id's like myfield_1, myfield_2, myfield_3, etc.

A coworker who specializes more in front end js implementations suggested that a more standard approach these days is to use html5 data attributes.  So instead of accessing the repeater fields by unique ids, it would be better to access the repeater fields via an html5 data attribute like data-styleid="1", data-styleid="2", data-styleid="3."

What is your opinion on these 2 diff patterns and when should 1 be used instead of the other?