Strip tag from text (in React JS)
Solution 1
I am guessing from your specification that your cleanHTML
is a string, so you would need to convert the string to a node (eg: by creating a div from it), and then parsing the nodes appropriately.
Please note that you really need to request the textContent
and not the innerHTML, as you do not want to have any html in your react output
const htmlContent = `<span class="remove-me">please</span>
<span class="remove-me">me too</span>
<span class="remove-me">and me</span>`;
const getNodesToRemoveFromElement = (stringContent) => {
const el = document.createElement('div');
el.innerHTML = stringContent;
return el.getElementsByClassName('remove-me');
};
for (let node of getNodesToRemoveFromElement( htmlContent ) ) {
console.log( node.textContent );
}
Solution 2
Your cleanHtml
is a string and not a node. So getElementsByClassName
does not apply as it is not a string function
You can use regular expressions to do this. Following code might help.
var stripedHtml = cleanHtml.replace(/<[^>]+>/g, '');
And stripedHtml
will have your html content without tags.
Radek Mezuláník
Updated on June 18, 2022Comments
-
Radek Mezuláník almost 2 years
I have multiple whole html code in variable cleanHTML and i need to strip specific tags from text.
let cleanHTML = document.documentElement.outerHTML
this:
<span class="remove-me">please</span> <span class="remove-me">me too</span> <span class="remove-me">and me</span>
to this:
please me too and me
I´m trying to do it with:
var list = cleanHTML.getElementsByClassName("remove-me"); var i; for (i = 0; i < list.length; i++) { list[i] = list[i].innerHTML; }
But i´m getting error from React cleanHTML.getElementsByClassName is not a function
Any idea how to do it in a way React likes?
-
Radek Mezuláník over 5 yearsI know that this will stripe all the tags, but i´m trying to stripe out only tags with a specific class