All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

Replace Character In String JavaScript

Last Updated : Mar 11, 2024

Replace Character In String JavaScript

In this tutorial we will show you the solution of replace character in string JavaScript, here we using replace method for replace some characters only we can also replace a word in string by using this method.

We have to pass two parameters first one is character needs to change and second one is to be replacing string then it will get replaced successfully and result appends on html element for display on webpage.

Step By Step Guide On Replace Character In String JavaScript :-

Here we defined div tag with id ‘res’ for appends result in webpage.

In script we defined two string variables ‘str1,str2’ with two different strings then we using replace method we replacing in str1 character ‘e’ is replaced globally with str2 ‘y’ character and replaced string stored to variable ‘re’ finally result appended to div element on html block with id ‘res’ for displayed on webpage.

<!DOCTYPE html>
<html>
    <head>
        <title>STRING REPLACE</title>
    </head>
    <body>
        <h3>STRING REPLACE</h3>
        <div id="res"></div>
        <script>
            let str1="Hi Everyone";
            let str2="y";
            let re=str1.replace(/e/gi,str2);
            document.getElementById('res').innerHTML="String 1: "+str1+"<br> String 2: "+str2+" <br>Replaced String: "+re;
        </script>
    </body>
</html>
  1. <!DOCTYPE html> tag which is instruct the web browser about what version of HTML file written in and it’s not have any ending tag.
  2. The<html> tag is used to indicate the beginning of HTML document.
  3. As above shown <head> tag is contains information about webpage and external file links are declared here. <title> tag is used for set the webpage title.
  4. Both <head> and <title> tags having their pair end tag, so we need to close the ending tags respectively. If you’re not closed anyone of ending tag properly that is also affect the webpage result.
  5. <body> tag is beginning of main coding part because it contain coding of entire website blocks and elements described here.
  6. In html we created <div> tag with ID ‘res’ for appends the result on webpage.
  7. In <script> we defined two string variables namely ‘str1,str2’ with values ‘Hi Everyone, y’ using ‘let’ keyword.
  8. Using replace method we replacing in string ‘Hi Everyone’ character ‘e’ replaced with character ‘y’, here ‘gi-refers replacing ‘e’ character at each place in string’ then replaced string value stored on variable ‘re’.
  9. Then the result is appends on html div element by ‘innerHTML’. So we appended result with div tag will displayed on webpage.
  10. Both </body>, </html> tags closed respectively. </body> tag indicates the end of body, Then </html> tag indicates the end of HTML document.

Conclusion :-

In conclusion now we are able to know how to replace character in string using javascript.

When we executing this program on browser we can see the result of variables str1,str2 values with replaced result string displayed on webpage.

Instead of replacing all possible particular character we can also do replace on first occurrence only by using this same concept the change is we need to give ‘g’ only instead of ‘gi’ at replace method.

I hope this tutorial on replace character in string JavaScript helps you and the steps and method mentioned above are easy to follow and implement.

Author Image About Anjali

Experienced Computer Programmer with a broad range of experience in technology. Strengths in application development and Object Oriented architecture design, front end programming, usability and multimedia technology. Expert in coding languages such as C, C++ Java, JavaScript, PHP and more.

Follow Anjali On Linkedin 🡪