How to replace underscores with spaces?

JavascriptJqueryHtml

Javascript Problem Overview


I have an array with objects inside of it, a few of the objects contain an underscore in the string.

Example:

{"name": "My_name"}

But I'm calling the name function in multiple places, one such place is in an image tag where the underscore is necessary, using JavaScript I want to select a certain div with the name in it and replace the underscore with space.

Example:

<div>
 <div class="name">
  My_name
 </div>
 <img src="My_name.jpg"/>
</div>

In the div.name I want it to say My name instead of My_name.

Javascript Solutions


Solution 1 - Javascript

You can replace all underscores in a string with a space like so:

str.replace(/_/g, ' ');

So just do that before the content is put in. If you need to perform the replacement afterwards, loop using each:

$('.name').each(function () {
    this.textContent = this.textContent.replace(/_/g, ' ');
});

Solution 2 - Javascript

ES2021 introduced the nifty replaceAll()-function which means it can be written as:

str.replaceAll('_', ' ')

If you want to do multiple elements just loop over them and use forEach():

const elements = document.querySelectorAll('.name')   
elements.forEach(e => e.innerText = e.innerText.replaceAll('_', ' '))

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionPhazingAzraelView Question on Stackoverflow
Solution 1 - JavascriptRy-View Answer on Stackoverflow
Solution 2 - JavascriptleonheessView Answer on Stackoverflow