Когда я нажимаю на кнопку, то ожидаю увидеть текстовый абзац в котором будет расположен текст из JSON. Но что-то не так и в консоли видна ошибка. Задача простая, всего лишь при клике на кнопку сделать запрос на сервер Node.js и вывести в браузер с помощью Ajax текст - и это не получается реализовать. А вот если представить, что будет много данных в хранится JSON, например у текста ещё есть заголовок, дата создания и пр., то вообще непонятно как это "легко" обработать и красиво записать в DOM в нужное место.
<script>
var btn = document.getElementById("button_more");
btn.addEventListener("click", xhr, false);
function xhr() {
var xhr = new XMLHttpRequest();
xhr.onload = function() {
if (xhr.status === 200) {
responseObject = JSON.parse(xhr.responseText);
} else {
alert("Ошибка сервера, получен ответ отличный от '200'");
}
var position = document.getElementById("text"); //получил доступ к элементу в котором будет располагаться распарсинные данные от сервера
var newEl = document.createElement("p"); //создал элемент в который будут записываться данные с сервера
position.appendChild(newEl); //вывел новый узел в качестве дочернего(пока пустой)
newEl.importNode(responseObject);// а теперь записал в созданный элемент данные с сервера
};
xhr.open("GET", "test-data.json", true);
xhr.send(null);
}
</script>
файл с данными из .json
{
"text": "Начало новостного текста........."
}
importNode
. Она здесь не нужна. Напишите следующееnewEl.textContent = responseObject.text
. – Stepan Kasyanenko 12 сен '18 в 10:24