I am stuck on a very beginner problem in JS, what I'm trying to do is add line-breaks in between text which the script adds dynamically after generating a random string, but I could not find a source that would match my case
The code that picks a random string
var textArray = [
'Gateway to wild imaginations!',
'Activating the send portal :D',
'Empowering nothing ;P'
];
var randomNumber = Math.floor(Math.random()*textArray.length);
var rndStr = textArray[randomNumber];
const h_1_elem = document.getElementById('main-h1');
h_1_elem.innerText = rndStr;
I would consider myself a beginner in programming so take this question with a pinch of salt
Don't use .innerText
and instead use .innerHTML
along with the HTML line break element of <br>
:
var textArray = [ 'Gateway to wild imaginations!', 'Activating the send portal :D', 'Empowering nothing ;P' ]; var rndStr = textArray[Math.floor(Math.random()*textArray.length)]; const h_1_elem = document.getElementById('main-h1'); h_1_elem.innerHTML = rndStr + "<br>"; rndStr = textArray[Math.floor(Math.random()*textArray.length)]; h_1_elem.innerHTML += rndStr + "<br>";
<div id="main-h1"></div>
You could use \n to insert a new line since you are using
h_1_elem.innerText = rndStr + "\n";
Also I created a function called randomNumber in order to call it more than one time.
var textArray = [ 'Gateway to wild imaginations!', 'Activating the send portal :D', 'Empowering nothing ;P' ]; const h_1_elem = document.getElementById('main-h1'); h_1_elem.innerText = textArray[randomNumber()] + "\n"; h_1_elem.innerText += textArray[randomNumber()] + "\n"; function randomNumber() { let number = Math.floor(Math.random()*textArray.length); return number; }
<div id="main-h1"></div>
If you run the code multiple times, you will get different messages. Just keep adding more :)
Regards
============ EDITED ============
Oh, you want a break line after each word. Didn't understand the question that way. So, for that you should use something like this:
var textArray = [ 'Gateway to wild imaginations!', 'Activating the send portal :D', 'Empowering nothing ;P' ]; const h_1_elem = document.getElementById('main-h1'); h_1_elem.innerText = textArray[randomNumber()].replaceAll(" ","\n"); function randomNumber() { let number = Math.floor(Math.random()*textArray.length); return number; }
<div id="main-h1"></div>
I just used
replaceAll(" ", "\n")
In order to replace every space by a break line. Hope this is what you want.
Regards
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.