LATEST >>

Welcome Here And Thanks For Visiting. Like Us On Facebook...

EXEIdeas – Let's Your Mind Rock » HTML-CSS-PHP-JavaScript / JavaScript Codes » How To Remove Or Strip All HTML Tags In Content Using Pure JavaScript?

How To Remove Or Strip All HTML Tags In Content Using Pure JavaScript?

How-To-Remove-Or-Strip-All-HTML-Tags-In-Content-Using-Pure-JavaScript Normally on the server-side, you could use a series of PHP functions (such as strip_tags) and remove HTML and ugly formatting. However, if you’re unable to use the server (or you use Node.js) to achieve this task, then you can still use Javascript to do it. In this article, you will find 3 ways to strip the HTML tags from a string in Javascript. So if you want to make this happen in pure vanilla JavaScript then it is possible via very short code snippet.

You can remove all HTML tags or even can remove specific HTML tags along with attributes and values and get your cleaned inner text of that HTML tag. This function can be very helpful if you ever display user input on your site. For example, if you create your own message board forum on your site a user could post a title along the lines of THIS SITE SUCKS!, which, because you would display the titles of each post on your board, would display their unwanted message in huge letters on your visitors’ screens.

There are many code snippets available online or on many other blogs and website but everyone is not able to optimize your blog or website so you need some optimized code snippet. So now checkout out code snippet for your blog and website that will give you all features for your desired code. Now grab the ready to use code and paste it where you want.

Table of Contents

1.) Remove Or Strip All HTML Tags In Content Using Regex:

/****************************************************************************/
// Remove Or Strip All HTML Tags In Content Using Regex
/****************************************************************************/
const originalString = "<h1>Hey <i>that's<u> <i>something</i>&lt;/h1>";
const strippedString = originalString.replace(/(<([^>]+)>)/gi, "");
console.log(strippedString);

2.) Remove Or Strip All HTML Tags In Content Using innerHTML :

/****************************************************************************/
// Remove Or Strip All HTML Tags In Content Using innerHTML 
/****************************************************************************/
function stripHtml(html){
    var temporalDivElement = document.createElement("div");
    temporalDivElement.innerHTML = html;
    return temporalDivElement.textContent || temporalDivElement.innerText || "";
}
var htmlString= "<div><h1>Hello World</h1>\n<p>It's me, Mario</p></div>";
console.log(stripHtml(htmlString));

3.) Remove Or Strip Specific HTML Tags In Content Using Regex:

/****************************************************************************/
// Remove Or Strip All HTML Tags In Content Using Regex
/****************************************************************************/
const originalString = "<h1>Hey <i>that's<u> <i>something</i>&lt;/h1>";
const strippedString = originalString.replace(/<\s*h4[^>]*>(.*?)<\s*/\s*h4>/gi, "");
console.log(strippedString);

Customization:

You can strip any HTML tags here. Nothing to customize anything more.

Troubleshooting the Errors

Do it with concentration and patience. Check your alls steps and again and all codes or scripts. If you find any error you can contact us anytime via comment or better via email, We are always here to help you.

Final Words:

That’s all we have. We hope that you liked this article. If you have any problem with this code in your template then feel free to contact us with a full explanation of your problem. We will reply to you as time allows us or If you have any doubts and problem please comment below. We are happy to help you! If you liked this article, Don’t forget to share this with your friends so they can also take benefit from it and leave your precious feedback in our comment form below. Happy development, See you in the next article.

Recommended For You:
How To Disable Right Click Menu In Blog And Website?

You Like It, Please Share This Recipe With Your Friends Using...

  

Be the first to write a comment.

Leave a Reply

Your email address will not be published. Required fields are marked *