Formatting HTML within jQuery

Question

So guys, I just want to format a string with jQuery, the string can be with closed html tags <div><h2></h2><span></span></div> or without it such as <div><h2></h2><span>, or it may contains images such as <img src=""/>, but I need to format it to have as result only plain text, I suppose that this can be done with a regex, I googled it, but could not find such an example.

So if you could help me, I'll be very thankful for help. Thanks

An exemple of the string:

<p> 
    <span style="color: rgb(35, 31, 32); font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 20px; ">Преимущества стоматологической установок Anthos</span>
</p> 
<ul class="tech_list" style="margin: 0px; padding-right: 0px; padding-left: 0px; list-style-type: none; color: rgb(35, 31, 32); font-family: Arial, Helvetica, sans-serif; "> 
    <li style="margin: 0px; padding: 8px 0px; font-size: 13px; line-height: 18px; overflow: hidden; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(204, 204, 204); "> 
       <img alt="Anthos " class="photo" src="http

Esailija · Accepted Answer · 2012-07-09 17:49:04Z

4

var body;

try {
    body = document.implementation.createHTMLDocument().body;
    //In chrome this avoids requesting images in the html
}
catch(e){
    body = document.createElement("body");
}
//this doesn't execute css or scripts
body.innerHTML = '<p> <span style="color: rgb(35, 31, 32); font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 20px; ">Преимущества стоматологической установок Anthos</span></p> <ul class="tech_list" style="margin: 0px; padding-right: 0px; padding-left: 0px; list-style-type: none; color: rgb(35, 31, 32); font-family: Arial, Helvetica, sans-serif; "> <li style="margin: 0px; padding: 8px 0px; font-size: 13px; line-height: 18px; overflow: hidden; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(204, 204, 204); "> <img alt="Anthos " class="photo" src="http'

console.log( $(body).text() );
//Преимущества стоматологической установок Anthos

demo http://jsfiddle.net/FvBzX/

edited Jul 9, 2012 at 17:49

answered Jul 9, 2012 at 17:37

Esailija

140k24 gold badges280 silver badges328 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Denees Over a year ago

Sorry, but not working, I updated my post with an example of text.

Esailija Over a year ago

@DenisHoss works fine jsfiddle.net/FvBzX, you are doing something differently ?

Denees Over a year ago

Yeap in jsfiddle works fine, I don't understand where I'm doing it wrong

Engineer · Accepted Answer · 2012-07-09 17:39:51Z

2

Try

$(".example_1").html( $(".example_1").text() );

Take the HTML of the div, grab the text of the div and place it back into the html of the outside containers.

Stolen from Googled Website

edited Jul 9, 2012 at 17:39

Engineer

48.9k12 gold badges90 silver badges93 bronze badges

answered Jul 9, 2012 at 17:36

Kris.Mitchell

9984 gold badges17 silver badges35 bronze badges

2 Comments

Esailija Over a year ago

This will execute scripts in the html. In chrome it will also request images.

Denees Over a year ago

Your solution working good, but, in some texts there are a little errors, so far your solution it's the best. I updated my post with an example of text.

Community · Accepted Answer · 2017-05-23 12:01:29Z

1

I guess this is what you're looking for:

https://stackoverflow.com/a/653699/1456376

jQuery.fn.stripTags = function() { return this.replaceWith( this.html().replace(/<\/?[^>]+>/gi, '') ); };

edited May 23, 2017 at 12:01

CommunityBot

11 silver badge

answered Jul 9, 2012 at 17:37

insertusernamehere

23.7k10 gold badges93 silver badges130 bronze badges

1 Comment

Denees Over a year ago

Sorry, but not working, I updated my post with an example of text.

Austin · Accepted Answer · 2012-07-09 17:37:04Z

0

this RegEx should strip all html tags from a string:

var StrippedString = OriginalString.replace(/(<([^>]+)>)/ig,"");

answered Jul 9, 2012 at 17:37

Austin

6,0442 gold badges26 silver badges24 bronze badges

1 Comment

Denees Over a year ago

Sorry, but not working, I updated my post with an example of text.

Collectives™ on Stack Overflow

Formatting HTML within jQuery

4 Answers 4

3 Comments

2 Comments

1 Comment

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

2 Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related