Javascript - удалить динамический атрибут

Question

В определенной части моего приложения мне нужно получить HTML-код, сгенерированный Vue, и отправить его в мой API.

Проблема в том, что Vue добавляет атрибут data-* ко всем элементам HTML.Как я могу удалить этот атрибут во всем экспортированном HTML?

console.log(this.$refs.template.$el.outerHTML)

возвращает:

<table data-v-2cacc920="" class="body" style="background-color: rgb(255, 255, 255); color: rgb(25, 25, 25); font-size: 14px;"><tbody><tr><td align="center" valign="top" class="float-center"><center><table align="center" class="container"><tbody><tr><td><div data-v-2cacc920="" class="columns-drop-area" style="background-color: rgb(255, 255, 255); padding: 0px;"><table data-v-2cacc920="" class="row"><tbody><tr><th data-v-2cacc920="" class="columns large-6 small-12 first"><table><tbody><tr><th><div data-v-2cacc920="" class="components-drop-area" style=""><div data-v-2cacc920="" class="item" style="border-radius: 0px; padding: 0px; font-size: 14px;"><p data-v-2cacc920="">Lorem ipsum dolor sit amet.</p></div></div></th></tr></tbody></table></th><th data-v-2cacc920="" class="columns large-6 small-12 last"><table><tbody><tr><th><div data-v-2cacc920="" class="components-drop-area"></div></th></tr></tbody></table></th></tr></tbody></table></div></td></tr></tbody></table></center></td></tr></tbody></table>

Как удалить data-v-2cacc920="" из всего HTML?

Помня, что этот атрибут динамический и он все время меняется ...

Я думаю, что одной из возможностей для этого является использование регулярных выражений внутри цикла со всеми элементами, но я не понимаю,что-нибудь о регулярном выражении = /

Примерно так:

this.$refs.template.$el.querySelectorAll('*')

Answer 1

Вы можете получить список всех атрибутов, обратившись к этому. $ Refs.template. $ El.attributes (который возвращает NamedNodeMap)

Если вы знаете, что эти атрибуты данных начинаются с определенного префикса, тогда выможет сделать следующее

const prefix = 'data-v';
for (const attribute of [...this.$refs.template.$el.attributes]) {
   if (attribute.name.startsWith(prefix)) {
     this.$refs.template.$el.removeAttribute(attribute.name);
   }
}