Así que tengo una aplicación que usa la API de Google Books y tengo un div con un póster de imagen. Por lo tanto, necesito obtener la identificación de la imagen de la URL de la imagen en la API de Google para cambiar los carteles de los libros en estos divs.
Código JavaScript:
const IMG_URL = "http://books.google.com/books/content?id="; //after "id=" I need to insert a particular image idFunción para mostrar libros:
function showBooks(data){ data.forEach(book => { const {title, authors, description} = book; const bookEl = document.createElement('div'); bookEl.classList.add('book'); bookEl.innerHTML = ` <div class="border"></div> <img src="${IMG_URL + }"> //here I should concatenate url with book id <div class="book_info"> <h3>Book title</h3> <p>Author</p> </div> <div class="overview"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris mi augue, ultricies vitae nisi vitae, suscipit elementum risus. Suspendisse vitae porta tellus, a finibus lorem. </p> </div> ` }); }Cómo se ve en la API:
"thumbnail": "http://books.google.com/books/content?id=WvfgAAAAMAAJ&printsec=frontcover&img=1&zoom=1&source=gbs_api"Construiría un objeto URL y luego extraería el parámetro id
const url = new URL(yourImageUrl) const id = url.searchParams.get("id")Lea más sobre la clase URL aquí: https://developer.mozilla.org/de/docs/Web/API/URL