Как я могу захватить только один конкретный элемент с помощью jquery из файла json onclick в мой HTML-файл?
Я пытаюсь захватить "био" из моего файла .json, когда кнопка нажата на моем html-файле, и заставить его приземлиться в div "примеры", так что при нажатии "био" появляется под "именем" и "возрастом". Имя и возраст работают нормально, но я не могу заставить кнопку захватить только биографию. Мне удалось захватить только весь массив.
Что я уже пробовал:
Я пробовал использовать функцию, которую покажу вам здесь, и я пробовал еще одну, похожую на ту, что ниже, но, похоже, ничего не происходит. Я использую vsCode с live server на chrome btw.
Также прошу прощения за интервал. Я довольно новый, если ты не можешь сказать!
script.js
$("#button").click(function() {
$.getJSON('einstein.json', function(read_data) {
$('examples').html(read_data.result[0].bio);
});
});
let newRequest = new XMLHttpRequest();
newRequest.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
let myObj = JSON.parse(this.responseText);
document.getElementById("example").innerHTML ="Name:" + myObj.name + "<br>"+"Birthday:" + myObj.birthday;
};
};
newRequest.open("GET", "einstein.json", true);
newRequest.send();
index.html
<!DOCTYPE html>
<html>
<head>
<title>Einstein</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="script.js"></script>
</head>
<body>
<div id="example"></div>
<button id="button">Click Me!</button>
<div id="examples"></div>
</body>
</html>
Эйнштейн.в JSON
{
"name": "Albert Einstein",
"birthday": "March 14 1879",
"bio": "Albert Einstein was a German mathematician and physicist who developed the special and general theories of relativity. In 1921, he won the Nobel Prize for physics for his explanation of the photoelectric effect. ... In his later years, Einstein focused on unified field theory."
}
Спасибо за помощь