JSFiddle - React, Tailwind, and code Playground
JavaScript
var attributeWhiteList = ['style']; // atributos que você quer deixar
var elementWhiteList = ['#text', 'TABLE', 'THEAD', 'TBODY', 'TFOOT', 'TR', 'TH', 'TD', 'P', 'B', 'DIV']; // elementos que você quer deixar
function cleanHTMLForEMail(node) {
if (node.nodeName === '#text') {
// aqui você editar node.textContent pra tirar espaço em branco
return node;
}
// listar atributos
var attributeNames = [];
for (var i = 0; i < node.attributes.length; i++) {
attributeNames.push(node.attributes[i].name);
}
// tirar todos os atributos fora da whitelist
for (var i = 0; i < attributeNames.length; i++) {
if (attributeWhiteList.indexOf(attributeNames[i]) === -1) {
node.removeAttribute(attributeNames[i]);
}
}
// listar filhos
var children = [];
for (var i = 0; i < node.childNodes.length; i++) {
children.push(node.childNodes[i]);
}
// tirar todos os filhos fora da whitelist
// e limpar os que estão dentro
for (var i = 0; i < children.length; i++) {
if (elementWhiteList.indexOf(children[i].nodeName) === -1) {
node.removeChild(children[i]);
} else if (children[i].nodeName === 'TR' && children[i].dataset.remove === 'true') {
node.removeChild(children[i]);
} else {
node.replaceChild(cleanHTMLForEMail(children[i]), children[i]);
}
}
return node;
}
var inputHTML = '<table><thead><tr data-remove="true"><th>{{theadContent}}</th></tr></thead><tbody><tr data-remove="true"><th>{{tbodyContent}}</th></tr></tbody><tfoot><tr data-remove="true"><th>{{tfootContent}}</th></tr></tfoot></table>';
var buffer = document.createElement('div');
buffer.innerHTML = inputHTML;
cleanHTMLForEMail(buffer);
document.body.appendChild(document.createTextNode(buffer.innerHTML))