0

I am trying to create a "Food Selector" project and I'm a little stumped. I want to add a little more style with each individual array elements. I don't want to replace my array elements with the image. Maybe just add an event listener that will upload an image simultaneously with the element. When the button is clicked it will show the array words, but also show a image of my choosing at the bottom of the screen

I've tried a couple things, but my last attempt was trying to target the array index and make it equal the CSS/Style that I want it to correspond with.. And that came to no avail ;-;

let close = ["Chipotle", "Wendy's", "Pollo Tropical", "Wings and Things", "Subway", "Sonic's", "Culvers", "Publix", "Chic Fil A"];
let healthy = ["Chipotle", "Subway", "Chic Fil A", "Smoothie"];
let dine = ["LongHorn", "Hooters", "Cheddars", "Senju Ramen"];

// chip.addEventListener('change', () => {
//     if()
// })

// close[1] = document.querySelector(".wendys");
Ferd
  • 1

2 Answers2

0

Why not use an array of objects ? each element in the array is an object with the name and the image:

let close = [
{ name: "Chipotle", image: "" },
{ name: "Wendy's", image: "" },
// rest of your array here
];
close[0].name; // return "Chipotle" ;
  • I keep getting "[object Object]" in the placeholder. I commented out my original array and replaced it with this format. Is this a common error? Or did I input something wrong? – Ferd Apr 06 '22 at 23:04
  • if you tried to print any element of the array for exemple close[0] you will get [object Object]. that's the string representation of your object you are trying to output. Do not forget to use . notation to access the name or the image field. more information check the validated answer here: https://stackoverflow.com/questions/4750225/what-does-object-object-mean – ThisAffection Apr 08 '22 at 07:39
0
const close = [{ "Chipotle", image: null }, { name: "Wendy's", image: null }]

close[0].name // Return "Chipotle"
close[0].image // Access image return null
kennarddh
  • 2,186
  • 2
  • 6
  • 21