Как при каждом клике в любой точке BODY, сгенерировать DIV с случайным цветом, в том же месте где был клик

 document.body.addEventListener('click', ()=>{ 
    let elm = document.createElement('div');             
    let x = Math.round(Math.random()*255);                          
    let y = Math.round(Math.random()*255);                          
    let z = Math.round(Math.random()*255);
    color = `rgb(${x},${y},${z})`;
    elm.style.backgroundColor = color;
    elm.style.width='100px';                          
    elm.style.height='100px';

    document.body.appendChild(elm);
})




<!DOCTYPE html>
 <html lang="en">
<head>
   <meta charset="UTF-8">
    <title>Document</title>
<style>
      body{
        width: 100%;
        height: 700px;
    }
</style>
</head>
 <body>
   <script src="script.js"></script> 
</body>
</html>

Нужна функция с параметром ('click', (event)=>{. При вызове в аргументе event будет объект события в котором среди прочего есть координаты клика. Делай elm абсолютно спозиционированным и используй координаты клика чтобы задать elm css значения top, left.


В большинстве случаев обработчики событий можно объявить с параметрами. И при вызове обработчика события в параметре будет объект события. Этот объект содержит детали события (например по какому элементу кликнули), а так же методы управления событием (типа запретить всплытие).