Как сделать что бы открывалось модальное окно и в него выводились данные из БД?

Для того чтобы создать модальное окно и выводить данные из базы данных в него при помощи JavaScript, вам понадобится комбинация нескольких технологий: HTML, CSS, JavaScript на стороне клиента, а также серверная технология (например, PHP, Node.js) для взаимодействия с базой данных.

Вот примерный шаги, которые вам нужно предпринять:

1. **HTML и CSS**: Создайте модальное окно в HTML и используйте CSS, чтобы стилизовать его по вашему желанию. Например:

<div id="myModal" class="modal">
  <div class="modal-content">
    <span class="close">×</span>
    <p id="modalData"></p>
  </div>
</div>

.modal {
  display: none;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.4);
}
.modal-content {
  background-color: #fefefe;
  margin: 15% auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

2. **JavaScript**: Напишите скрипт, который будет открывать модальное окно и получать данные из базы данных. Примерно так:

var modal = document.getElementById("myModal");
var modalData = document.getElementById("modalData");

function openModalWithData(data) {
  modal.style.display = "block";
  modalData.innerHTML = data;
}

// Обработчик события для закрытия модального окна
var closeBtn = document.getElementsByClassName("close")[0];
closeBtn.onclick = function() {
  modal.style.display = "none";
}

3. **Серверный код**: На стороне сервера напишите скрипт, который будет обращаться к базе данных и возвращать нужные данные. В случае использования PHP, это может выглядеть следующим образом:

// Файл get_data.php
<?php
// Подключение к базе данных и получение данных
$data = "Данные из базы данных";
echo $data;
?>

4. **Обмен данными между клиентом и сервером**: Используйте AJAX для отправки запроса на сервер и получения данных. Например, с помощью jQuery:

$.get("get_data.php", function(data) {
  openModalWithData(data);
});

Это общая схема, которая может потребовать дополнительной настройки и адаптации под ваш конкретный проект. Не забудьте обработать возможные ошибки и защитить ваше приложение от уязвимостей, таких как SQL-инъекции.