Так, как вы только учитесь, я не буду вам объяснять ООП, а напишу всё процедурно, как у вас. Внимание, никогда не храните подключение к базе с другим кодом сделайте лучше так, создайте файл config.php и организуйте там подключение к базе:
$server = "localhost";
$user = "имя пользователя";
$password = "пароль";
$condb = new mysqli($server, $user, $password, "mydb");
И подключайте этот файл к вашим файлам:
/* это ваш файл connect.php как видете в нем нет подключение к бд и вам не придётся его пихать везде, достаточно просто подключить файл конфига*/
include('config.php');
$sql = "SELECT id, about, url FROM videos WHERE id = 4";
$result = $condb->query($sql);
if($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
$res = $row["url"];
}
}
Создайте отдельный файл для ajax запросов:
/* допустим он будет называться ajax.php*/
include('config.php'); // подключим конфиг и выполним запрос к бд
$sql = "SELECT id, about, url FROM videos WHERE id = 4";
$result = $condb->query($sql);
$row = $result->fetch_assoc();
$res = array(
"url" => $row['url'], "id"=> $row['id']
); //Собираем массив с данными необязательно отдавать html - работайте с json.
echo json_encode($res); // Преобразуем его в json объект и отправим на клиент
Далее идет код клиента смотрите внимательно, что делается:
function ajax() {
var newLi = document.createElement('div'), // Собираем разметку на клиенте, для этого создаем div
list = document.querySelector(".list");
xhr = new XMLHttpRequest();
xhr.open("GET", "ajax.php", true);
xhr.onreadystatechange = function() {
if(xhr.readyState==4 && xhr.status == 200) {
console.log(xhr.responseText); // Всегда смотрите в консоль, какие данные приходят
var Url = JSON.parse(xhr.responseText); // Распарсим пришедшие данные
newLi.className = "new"; //добавляем класс в уже созданный див
newLi.innerHTML = Url.url; //вставляем данные в созданный див
list.appendChild(newLi); // и вставляем весь див в DOM
}
}
xhr.send();
}
Как-то так. Если есть ошибки, говорите мне.
