Replace HTML Element Contents

Question

I have the following HTML.

<div class="red">Div One</div>
<div class="green">Div Two</div>
<div class="blue">Div Three</div>

What's the best way of replacing the text in the div with the green class?

Also, I need a way of retrieving the contents of a tag by element name (), or element name and class ().

Thanks for your help!

Is this an input file you're reading, or part of the webpage you're generating with PHP? — Mr Lister
– Mr Lister, Commented Jan 29, 2012 at 19:05

Martin. · Accepted Answer · 2012-01-30 06:21:56Z

3

You can use some kind of HTML parser. I'd use DOMDocument or phpQuery.

In the edge case, you can use regex. But I do not recommend this to you!

$html = preg_replace('~(<div class="green">)(.*)(</div>)~', '$1Replacement$2', $html);

if you want to use class green optional, use

$html = preg_replace('~(<div( class="green">|>))(.*)(</div>)~', '$1Replacement$4', $html);

edited Jan 30, 2012 at 6:21

answered Jan 29, 2012 at 19:00

Martin.

10.5k3 gold badges45 silver badges69 bronze badges

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

8 Comments

kba Over a year ago

There are cases where regular expressions is bad, and yes, HTML is not a regular language, but sometimes it's still often preferable to use regex for something as simple as this, instead of loading a heavy XML library.

user826855 Over a year ago

@Martin what is so bad about using regex for parsing HTML?

user826855 Over a year ago

@Martin How do I edit the regex so that either <div class="green" or <div> is present?

Martin. Over a year ago

@user826855: imagine that you'll accidentally add a space after class="green". Everything breaks. That won't happen in HTML parsers.

Martin. Over a year ago

@user826855: you want to create class green optional?

|

Prajwal · Accepted Answer · 2012-01-29 19:10:41Z

2

jQuery can do it for you

$(".green").empty().html("your new content for div");

and to retrieve content

var content=$(".blue").html();  //retrieves content inside class blue

answered Jan 29, 2012 at 19:10

Prajwal

3981 gold badge7 silver badges19 bronze badges

2 Comments

user849137 Over a year ago

why would you use .empty when .html replaces the current content with the new itself?

Prajwal Over a year ago

Quentin Its a jQuery @nav_nav .empty is not necessary here but I just wrote it to make clear understanding even while reading only.

Collectives™ on Stack Overflow

Replace HTML Element Contents

2 Answers 2

8 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related