The Code for BACKTOTHEFRONT


                    
                    // get the string from the page.
                    function getString(){
                        document.getElementById("alert").classList.add("invisible");
                    
                        let userString = document.getElementById("userString").value;
                    
                        let revString = reverseString(userString); 
                        displayString(revString);
                    }
                    
                    
                    
                    // reverse the string.
                    function reverseString(userString){
                    
                        let revString = "";
                    
                    
                        // reverse a string using a for loop
                        for (let index = userString.length - 1; index >= 0; index--) {
                            
                            revString += userString[index];
                        }
                    
                        return revString;
                    }
                    
                    
                    
                    // display the reverse string.
                    function displayString(revString){
                        // write to the DOM
                        document.getElementById("message").innerHTML = `Your string reversed is: ${revString}`;
                    
                        // show the alert box
                        document.getElementById("alert").classList.remove("invisible");
                    }
                
                

Back to the front is a coding excerise in JavaScript where you enter a string and the program reverses it. It includes three functions. getString(), reverseString(), and displayString().

getString()

This function gets the string from the document object model.

reverseString()

This function uses a for loop to loop backwards through the string adding it to a new string variable as it goes.

displayString()

This function sets the innerHTML of a p tag in the document object model and shows the alert box.