String replace (javascript)

Question

I have a piece of string:

'Dow<br> <span class="table-sub-header">Value</span>'

I want to replace 'Value' inside the span with an arbitrary variable. I know that the span class will be there every time.

I've tried things like:

var s = 'Dow<br> <span class="table-sub-header">Value</span>';

And then doing a replace with something like this as the regex:

/<span class="table-sub-header">*</span>/

But it looks messy. Is there a clean way of doing this?

Edit: 'Value' in this case is arbitrary. I don't know what it is and I wanted a general method to replace what is in the span.

Are you within a browser environment? Can you interact with the DOM to get hold of this? — James Thorpe
– James Thorpe, Commented Jun 15, 2016 at 15:44
I am on the browser and I'm getting this value as a property from a library object. I thought it would be weird to change it to a DOM object just for a string placement, especially since I would need to convert the DOM object back to a string. — user1413969
– user1413969, Commented Jun 15, 2016 at 15:47

tsh · Accepted Answer · 2016-06-15 15:45:31Z

If you are working in browser, you may try put s in some element innerHTML and replace it as it in dom do

var s = 'Dow<br> <span class="table-sub-header">Value</span>'; t = document.createElement('div'); t.innerHTML = s; t.querySelector('.table-sub-header').textContent = 'Something Else'; t.innerHTML // 'Dow<br> <span class="table-sub-header">Something Else</span>'

BTW, your regexp should be something like /<span class="table-sub-header">(.*)<\/span>/

Sylvan D Ash · Accepted Answer · 2016-06-15 15:45:14Z

0

Have you tried the replace string method?

var s = 'Dow<br> <span class="table-sub-header">Value</span>'; s = s.replace("Value", "New Value");

answered Jun 15, 2016 at 15:45

Sylvan D Ash

1,13714 silver badges24 bronze badges

3 Comments

James Thorpe Over a year ago

While that answers the very specific example in the question, I'm not sure that's what the OP is after. If you're doing that, you may as well just write var s = 'Dow<br> <span class="table-sub-header">New Value</span>'; in the first place.

Sylvan D Ash Over a year ago

If he's working with strings, then this is the simplest. If he's working with HTML elements (and not strings), then either @tsh answer or $(".table-sub-header").text("my text")

Sylvan D Ash Over a year ago

But he mentioned string...hence the answer

Manish · Accepted Answer · 2016-06-15 15:50:30Z

Yes, you can use jQuery for this.

var s = 'Dow<br> <span class="table-sub-header">Value</span>'; var div_wrapper = '<div style="display:none;">'+s+'</div>'; $(document).ready(function(){ $('body').append(div_wrapper); var new_value = 'newvalue'; // an arbitrary variable $('.table-sub-header').text(new_value); console.log($('.table-sub-header').text()); });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <html> <body> </body> </html>

is string s trustable? what if s = 'Dow<br> <span class="table-sub-header"><script>alert(/xss/)</script></span>'
@tsh string s should be trustable, Else you need to refine it before appending it to div using javascripts filter html tags option.

Vasfed · Accepted Answer · 2016-06-15 16:07:24Z

You can dynamically replace what is in the span tag by using JavaScript or any JavaScript library. For example using Javascript you can use a class selector to select the span and set the inner html to whatever value you want based on a condition or logic of some sort. You can also use Jquery .text()

refer to the links below https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML http://api.jquery.com/text/

Collectives™ on Stack Overflow

String replace (javascript)

4 Answers 4

Comments

3 Comments

2 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

3 Comments

2 Comments

Comments

Related