? ????? JavaScript? ???? ??? ??? ?? ???? ??? ??? ?????. ??? ???? ???? ??? ? ?? ???? ???? ?????. ?? ??? ?? ??? ??? ???? ??? ?? ???? ???? ??? ??? ????? ???? ??? ?????.

HTML ??

??, ? ??? ???? ? ? ??? ?? ?? ??? ? ?? ??? ???? HTML ??? ???? ???.

 <div>
  <h1 class="book-generator">??? ?? ??</h1>
  <div id="???">
    <img src="/static/imghw/default1.png" data-src="./js/books.js" class="lazy" id="bookCover"   style="max-width:90%" alt="? ??">
  </div>
  <button onclick="newBook()" class="button-book">? ? ??</button>
  <script></script>
</div>

? HTML ????? ?? h1, ? ??? ???? img ?? ? ?? ??? ???? div ????? ????. img ??? ID? JavaScript ???? ???? ???? ?????? ? ???? bookCover? ?????. style ??? ???? ?? ??? ???? ? ????, alt ??? ???? ??? ? ?? ?? ?? ???? ???? ? ?????.

?????? ??

????, ??? ?? ?? ??? ???? ?? JavaScript ??? ???? ???.

 var ??? = [
  'https://m.media-amazon.com/images/I/81jRqrKKObL._AC_UL800_FMwebp_QL65_.jpg',
  'https://m.media-amazon.com/images/I/81JgX8VgZiL._AC_UL800_FMwebp_QL65_.jpg',
  'https://m.media-amazon.com/images/I/71CBWHK035L._AC_UL800_FMwebp_QL65_.jpg',
  'https://m.media-amazon.com/images/I/91pXKpUfGgL._AC_UL800_FMwebp_QL65_.jpg',
];

lastBook = -1? ????; // ??? ?? ? ? ???? ?? ???? ?? ????.

?? newBook() {
    ??? ??? ??;
    ?? {
      randomNumber = Math.floor(Math.random() * (images.length));
    } while (randomNumber === lastBook);
    lastBook = ?????;
    document.getElementById('bookCover').src = ???[randomNumber];
}

? JavaScript ??? ?? ? ?? ???? URL? ??? ??? ??? ?????. ?? ?? ?? ??? ???? ?? ??? ?? ??? ??? ???? lastBook ??? ?????.

newBook ????? ?? ??? ?? ????. ?? ??? RandomNumber? ??? ?? do...while ??? ???? ?? ??? ??? ??? ?? ??? ??? ??? ?????. ??? ?? ?? ???? ?? ??? ??? ?? ?????. ????? lastBook ??? ?????? bookCover ??? src ??? ? ? ?? ???? URL? ?????.

?? ??

• ??? ?? : ? ?? ???? URL ??? ?????. ??? ?? ??? URL? ????? ??? ? ????.
• lastBook ?? : -1? ????? ?? ??? ?? ??? ?????.
• newBook ???? :
  • Math.random() ? Math.floor()? ???? ??? ??? ???? ??? ??? ?????.
  • ??? ???? ?? ????? do...while ??? ???? ??? ??? lastBook? ??? ?????.
  • lastBook? ?? ?? ?? ??? ???? ???????.
  • document.getElementById('bookCover')? ???? img ??? ???? src ??? Images[randomNumber]? ???? ? ?? ???? ???????.

??? ?

• books.js ??? HTML ??? ??? ???? ??? ?????.
• ??? ?? ? ?? ???? ??? ???? ??? ? ????.
• ?? ?? ? ??, ?? ?? ?? ??? ???? ? ??? ??? ? ????.
• ? ?? ??? ??? ?? ???? ??? ? ?? ?????? ???? ?? ??????.
• ???? ?? ??? ???? ??? ???? ?? AJAX ??? ??? ? ????.

??

?? ??? ?? ??? ?? ?? ???? ????? ??????. ? ???? ??? ? ?? ???? ???? ???? ??? ?? ????? ???? ????. ? ?? ? ?? ??, ??? ??? ?? ?? ? ??? ?? ???? ??? ? ????. ? ????? JavaScript ? ??? ?? ?? ??? ?? ???? ??? ? ??? DOM ??, ??? ?? ? ?? ??? ?? ??? ? ? ???? ? ??? ???.

? ??? ??? ?? ???: JavaScript? ???? ??? ?? ?????. ??? ??? PHP ??? ????? ?? ?? ??? ?????!