Question

0

50

Views

How to get my code to show programmatically in my html file

i'm trying to get my code to show the objects on webpage as well as the image associated with it and Each car object should also include a showMore() method. This method should display a dialogue that displays all the details about the specific car object.

here's the code:

const show = document.getElementById('show');
function carDescription(make, model, colour, image, registrationnumber, price ) {
    this.make = make;
    this.model = model;
    this.colour = colour;
    this.image = image;
    this.registrationnumber = registrationnumber;
    this.price = price;
};
let car = { make:"Porsche", model:"GT3", colour:"Black", image:"src=https://pictures.topspeed.com/IMG/crop_webp/201210/1200hp-porsche-911-g_1920x1080.webp" , registrationnumber:"LMO 909 GP", price: 1000000};
let car2 = newcarDescription("Ford", "Fiesta", "Red","https://i.ytimg.com/vi/abVgt23rmrA/hqdefault.jpg", "MNO 010 EC",  100000);
let car3 = newcarDescription("Opel", "Corsa", "White","https://img.gumtree.co.za/api/v1/za-pt10-ads/images/a1/a15f67b3-c11c-40b6-85ad-2987e84e956b?rule=s-I3.auto", "KLJ 899 GP",  55000);
let car4 = newcarDescription("Mazda", "CX-5", "Black","https://i.pinimg.com/originals/54/d2/0b/54d20b0bee90aaef22a68b5628441832.jpg" ,"TYH 890 GP",  210000);
let car5 = newcarDescription("Toyota", "Hilux", "Gold","https://imganuncios.mitula.net/medium/toyota_hilux_toyota_hilux_1050104654262066309.jpg" ,"HSG 573 EC",  250000);


function print()
{
    let myString = JSON.stringify(car);
document.getElementById("show").innerHTML = `<h3>${car}</h3>`
}

<!DOCTYPE html>
<html onload="print()"  lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cars</title>
</head>

<body >
    <div id="show">

    </div>

    
    <script src="cars.js"></script>
</body>
</html>

3 months ago ·

Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Loading

Answer 1 · 2022-06-25T04:40:22.240Z

The print function should make a tag for every element of the car object.

let car = { make:"Porsche", model:"GT3", colour:"Black", image:"src=https://pictures.topspeed.com/IMG/crop_webp/201210/1200hp-porsche-911-g_1920x1080.webp" , registrationnumber:"LMO 909 GP", price: 1000000};

(function print()
{
    let h3 = document.createElement("h3");
    h3.innerHTML= car.model;
    document.getElementById("show").appendChild(h3);
})();