I have a txt file that looks like this:
1||fun||ball
2||job||hammer
3||run||feet
I want to load that into my code and convert it to:
<dt>1</dt><dd>fun <img src="ball.png"></dd>
<dt>2</dt><dd>job <img src="hamm.png"></dd>
<dt>3</dt><dd>run <img src="feet.png"></dd>
I tried like this:
const openrooms = `1||fun||ball
2||job||hamm
3||run||feet`;
const roomlist = openrooms.split('\n');
for (var rooms in roomlist) {
room = roomlist[rooms].split('||');
for (var {roomid, name, icon} in room) {
result = `<dt>${room[roomid]}</dt><dd>${room[name]} <img src="${room[icon]}"></dd>`;
}
}
document.getElementById("destination").innerHTML = result;<div id="destination"></div>all I get is undefined. Why is that? Please try the fiddle below:
Try:
const openrooms = `1||fun||ball
2||job||hamm
3||run||feet`;
const roomlist = openrooms.split('\n');
const result = roomlist.map(e => {
var split = e.split('||')
return `<dt>${split[0]}</dt><dd>${split[1]} <img src="${split[2]}.png"></dd>`
}).join('')
document.getElementById("destination").innerHTML = result;<div id="destination"></div>The second loop attempts to destructure the strings from the second split.
Try something closer to:
const openRooms = `1||fun||ball
2||job||hammer
3||run||feet`
const rooms = openRooms.split('\n')
result = ""
rooms.forEach(room => {
const [id, name, icon] = room.split('||')
result += `${id} room: ${name} - ${icon}\n`
})
console.log(result)(Although why not just store them in an object in the first place?)
const openrooms = `1||fun||ball
2||job||hamm
3||run||feet`;
const result = openrooms.split("\n").map((row)=>{
const items = row.split("||");
return `<dt>${items[0]}</dt><dd>${items[1]} <img src="${items[2]}.png"></dd>`})
document.getElementById("destination").innerHTML = result;