Replacing text in JavaScript: Learn how to substitute a specific word in JavaScript using an array

Question

Replacing text in JavaScript: Learn how to substitute a specific word in JavaScript using an array

I need assistance with updating the content of my div using PHP-like functionality. Is there a way to achieve this?

<?php
$val_1 = array('text_1', 'text_2');
$val_2 = array('text 1', 'text 2');
$replace = str_replace($val_1, $val_2, $div_id);
echo $div_id;
?>

The content within my div will initially be in English, but I would like to dynamically replace it based on the user's browser language.

For example, if the browser language is set to "fr," then the initial English text should be replaced accordingly, otherwise it remains in English.

<script>
var langs = "<?php echo substr($_SERVER['HTTP_ACCEPT_LANGUAGE'], 0, 2); ?>";
var myDiv = document.getElementById("msg_error");
var txt_1 = ["Hello world", "I love banana"];
var txt_2 = ["Bonjour le monde", "J'aime les bananes"];
   
    if(langs == "fr") {
        myDiv.innerHTML = txt_2[0]; // Update with French text
    } else {
        myDiv.innerHTML = txt_1[0]; // Keep original English text
    }
</script>

Your assistance in implementing this solution would be greatly appreciated!

javascript

Answer 1

Answer №1

function replaceStrings(a, b, c) {
    var copyText = c;
    if (typeof a === 'string' && typeof b === 'string') {
        copyText = copyText.replace(new RegExp(v, 'g'), b);
    } else if (Array.isArray(a)) {
        if (!Array.isArray(b)) {
            a.forEach((value) => {
                copyText = copyText.replace(new RegExp(value, 'g'), b);
            });
        } else {
            a.forEach((value, i) => {
                copyText = copyText.replace(new RegExp(value, 'g'), b[i]);
            });
        }
    }
    return copyText;
}

window.addEventListener('load', function() {
    var myContentDiv = document.getElementById('myContentDiv');
    var content = myContentDiv.innerText;
    var str1 = ["Hello world", "I love banana"];
    var str2 = ["Bonjour le monde", "J'aime les bananes"];
    myContentDiv.innerText = replaceStrings(str1, str2, content);
});

<div id="myContentDiv">Hello world, I love banana</div>

Answer 2

function replaceStrings(a, b, c) {
    var copyText = c;
    if (typeof a === 'string' && typeof b === 'string') {
        copyText = copyText.replace(new RegExp(v, 'g'), b);
    } else if (Array.isArray(a)) {
        if (!Array.isArray(b)) {
            a.forEach((value) => {
                copyText = copyText.replace(new RegExp(value, 'g'), b);
            });
        } else {
            a.forEach((value, i) => {
                copyText = copyText.replace(new RegExp(value, 'g'), b[i]);
            });
        }
    }
    return copyText;
}

window.addEventListener('load', function() {
    var myContentDiv = document.getElementById('myContentDiv');
    var content = myContentDiv.innerText;
    var str1 = ["Hello world", "I love banana"];
    var str2 = ["Bonjour le monde", "J'aime les bananes"];
    myContentDiv.innerText = replaceStrings(str1, str2, content);
});

<div id="myContentDiv">Hello world, I love banana</div>

Replacing text in JavaScript: Learn how to substitute a specific word in JavaScript using an array

Answer №1

Similar questions

comparing multiple values separated by commas with JavaScript

Map Loader for GeoJson Leaflet Integration

A guide to revealing the value of a button or anchor tag using AngularJS

Starting with NodeJS: Troubleshooting module not found error

Viewing multiple pages and maintaining sessions in Laravel

Assign the value of "td" to the variable "val"

What strategies can be utilized to enhance the cleanliness of these functions?

Correct the spacing around periods, even within separate div elements

Is there a way to temporarily halt a jQuery animation for 2 seconds before automatically resuming it, without relying on mouse-over or mouse-out triggers?

JavaScript functions with similar parent names

Convert numbers to words in the Indian currency format as you type up to a 16-digit number, displaying the Indian rupees symbol automatically without the need to click a button

Eliminate HTML field based on checkbox status

Exploring the capabilities of useRef in executing a function on a dynamically created element within a React/Remix/Prisma environment

transferring a JavaScript variable to PHP upon submitting a form

Tips on implementing a jQuery .load() function using an anchor tag within dynamic content

In an attempt to successfully retrieve data from a formatted XML API, I am working on making a straightforward API call using JavaScript/TypeScript

Exploring the global document object within Next.js

Example when a specific $scope.apply() is needed:

Using the Play framework to showcase data in an HTML table

Node.js: Breaking the Rules with an Illegal Break Statement