Untitled
unknown
plain_text
2 years ago
1.6 kB
3
Indexable
<!DOCTYPE html> <html> <head> <title>eBook Store</title> <!-- Add necessary CSS and JavaScript files --> </head> <body> <header> <h1>Welcome to the eBook Store!</h1> <!-- Add navigation links here --> </header> <main> <section id="books"> <!-- Display a list of available books --> </section> </main> <footer> <p>© 2023 eBook Store. All rights reserved.</p> </footer> </body> </html> // Sample data for books (replace with your actual data) const books = [ { title: "Book 1", author: "Author 1", price: 9.99 }, { title: "Book 2", author: "Author 2", price: 14.99 }, { title: "Book 3", author: "Author 3", price: 19.99 } ]; // Function to display books function displayBooks() { const booksSection = document.getElementById("books"); booksSection.innerHTML = ""; books.forEach((book) => { const bookDiv = document.createElement("div"); bookDiv.innerHTML = ` <h3>${book.title}</h3> <p>Author: ${book.author}</p> <p>Price: $${book.price}</p> <button onclick="addToCart('${book.title}')">Add to Cart</button> `; booksSection.appendChild(bookDiv); }); } // Function to add a book to the cart function addToCart(bookTitle) { // Implement the logic to add the book to the cart // You can use JavaScript objects or a server-side database for this console.log(`Added '${bookTitle}' to the cart.`); } // Call the displayBooks function to populate the books section displayBooks();
Editor is loading...