Json.parse Só da Indefinido!

Front-end JavaScript
#1

Olá eu criei um arquivo json com o nome data.json que está assim:

[{
	"title_postagem_1_parse": "Um Dia Em Paris",
	"descrição": "foi lindo!",
	"time_init_post_1_parse": "03:04",
	"image_post__1_parse": "3da7ed2b083617efad9e643bb032d96dc2f625ae_00.jpg"
}]

E eu tenho um HTML que tá assim:

<html>

<head>
	<meta charset="utf-8">
	
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous"></script>
</head>

<body>
	<script>
		var xmlhttp = new XMLHttpRequest();
		
		xmlhttp.onreadystatechange = function() {
			if (this.readyState == 4 && this.status == 200) {
				var posts = JSON.parse(this.responseText);
				var post_1_div = document.createElement("div");
				var img_post_1 = document.createElement("IMG");
				var title_post_1 = document.createElement("h2");
				var d_post_1 = document.createElement("h4");
				var time_post_1 = document.createElement("p");
				
				img_post_1.src = "users_post/imagens/" + posts.image_post__1_parse;
				time_post_1.innerHTML = posts.d_post_id_1_parse ;
				title_post_1.innerHTML = posts.title_postagem_1_parse;
				d_post_1.innerHTML = posts.nome;
				
				post_1_div.appendChild(img_post_1);
				post_1_div.appendChild(d_post_1)
				
				document.body.appendChild(post_1_div);
			}
		};
		
		xmlhttp.open("GET", "data.json", true);
		xmlhttp.send();
	</script>
</body>

</html>

Mais só dá Indefinido quando eu tento chamar qualquer informação do meu json o que tem de errado?

#2

Em qual servidor vc está rodando esse código?

#3

No Wamp Server

#4

Ah sim, agora que reparei. Como seu json é um array, vc não pode acessar a propriedade do objeto diretamente. Vc deve informar qual o índice do array que vc quer, para depois acessar a propriedade.

posts[0].title_postagem_1_parse;
#5

Valeu!