CODEWITHSUNDEEP
javascripthtmlnumbersconvertersnames
user4563455
user4563455

Reputation:

Convert a number into a name

For example, I have <span id="convertNumberToName">1</span> somewhere on my page.
Notice the "1", I want to covert "1" into let's say "John" every time the "1" is within a span tag with "convert" as the id.

I also want "2" to be converted to "Pete". And "3" to be converted to "Bob".

So if my html is:

<span id="convertNumberToName">1</span>
<span id="convertNumberToName">2</span>
<span id="convertNumberToName">3</span>


My page reads:

John
Pete
Bob

Anyone know how to do this?

Upvotes: 0

Views: 175

Answers (2)

SilverNeon123
SilverNeon123

Reputation: 31

shorter way to do this >

<script>
var names = ['John', 'Pete', 'Bob'];
var div = document.getElementById('convertNumberToName');
div.innerHTML = names[div.innerHTML];
</script>

Upvotes: 0

user4583684
user4583684

Reputation:

This will convert the numbers into your chosen names.

<script type="text/javascript">
window.onload = function() {

    var e = document.getElementsByTagName('span');

    for (var i = 0, l = e.length; i < l; i++) {
        if (typeof e[i].className !== 'undefined' && e[i].className === 'convertNumberToName') {
            e[i].innerHTML = convertToName(e[i].innerHTML);
        }
    }

    function convertToName(n) {
        var names = ['John', 'Pete', 'Bob'],
            n = parseInt(n, 10) - 1;

        if (names[n]) {
            return names[n];
        }

        return 'Unknown';
    }

};  
</script>



<span class="convertNumberToName">1</span><br />
<span class="convertNumberToName">2</span><br />
<span class="convertNumberToName">3</span>

Upvotes: 4

Related Questions