Перебор data атрибута.
 

Здравствуйте. Есть форма для заполнения данных кредитной карты.

<form id="payment_form" autocomplete="off">
    <input type="text" data-cp="cardNumber">
    <input type="text" data-cp="expDateMonth">
    <input type="text" data-cp="expDateYear">
    <input type="text" data-cp="cvv">
    <input type="text" data-cp="name">
    <button type="submit">Оплатить</button>
</form>

Как мне перебрать одинаковый атрибут data-cp для formData.append с именем атрибута и value??
Спасибо.
P.S. Прописать "name" нельзя так как несмотря на то, что я в рамках одного сервера передаю ajax'ом в их предварительном скрипте подготавливает криптограмму платежных данных и на "name" ругается. Из их документации:
Понимаю, что можно прописать id или сlass, но как-то громоздко выглядит 5 штук getElementById.

HotReboot,
:-?

document.querySelectorAll('[data-cp]').forEach(({value, dataset : {cp}}) => formData.append(cp, value));

Я не понял, что такоеНо наверно речь идет об этом

const fd = new FormData(f);
document.fetElementById('payment_form').querySelector('input')
   .forEach(inp => fd.append(inp.dataset.cp, inp.value);