Как я могу отобразить содержимое из файла .json с библиотекой jquery?
я пытаюсь получить данные из моего файла .json (с сервера) и просто отобразить их на странице. Я не очень хорошо разбираюсь в синтаксисе JS, извините.
Я пытался отобразить только один параметр из файла, но ничего не вижу на экране.
<html>
<head>
<script type = "text/javascript"
src = "http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>
<script>
$(function() {
$.getJSON("video.json", function(data)) {
$.each(data.NewsSources, function(i, f) {
var vid = f.Name;
$(vid).appendTo("#userdata");
});
});
});
</script>
</head>
<body>
<div id= "userdata">
<h1>This is a name</h1>
</div>
</body>
</html>
видео.json
{
"NewsSources": [
{
"ID": 2004,
"Name": "365TV Brasil",
"Description": "",
"URL": "https://www.instagram.com/365scoresbra",
"Lang": 31,
"CountryID": 21,
"LogoUrl": "",
"ImgVer": 0
}
]
}
Ответы 2
У вас небольшая ошибка, вместо $(vid).appendTo("#userdata") нужно использовать $("#userdata").append(vid).
data = {
"NewsSources": [{
"ID": 2004,
"Name": "365TV Brasil",
"Description": "",
"URL": "https://www.instagram.com/365scoresbra",
"Lang": 31,
"CountryID": 21,
"LogoUrl": "",
"ImgVer": 0
}]
};
$.each(data.NewsSources, function(i, f) {
var vid = f.Name;
$("#userdata").append(vid);
});<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id = "userdata">
<h1>This is a name</h1>
</div>Также на JSFiddle.
И почему… ну, $("365TV Brasil") — это селектор jQuery, который ничего не выберет на вашей странице. С другой стороны, создание текстового узла в jQuery может быть сложным. Поэтому лучше использовать Метод добавления jQuery, который позволяет использовать текст в качестве параметра:
DOM element, text node, array of elements and text nodes, HTML string, or jQuery object to insert at the end of each element in the set of matched elements.
да, спасибо, этот код работает. Также у меня была одна небольшая ошибка с двумя скобками вместо одной. в этой строке
$.each(data.NewsSources, function(i, f)
<html>
<head>
<script type = "text/javascript"
src = "http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>
<script>
$(function() {
$.getJSON('https://ws.365scores.com/Data/news/?newsitems=101640575', function(data) {
$.each(data.NewsSources, function(i, f) {
var vid=f.Name;
$("#userdata").append(vid);
});
});
});
</script>
</head>
<body>
<div id= "userdata">
<h1>This is a name</h1>
</div>
</body>
</html>
Вместо
$(vid).appendTo("#userdata")используйте$("#userdata").append(vid).