Reading and manipulating json data using jquery

Please note:

var valorRetornado = '[{"id":"769","cidade":"minhacidade","estado":"PR"},{"id":"855","cidade":"Caram","estado":"PR"}]'
        // convertendo a string em objeto
        var obj = JSON.parse(valorRetornado);

        obj.forEach(function(o, index){
            console.log(o.cidade);
        });

The collaborators gave several examples, but in all of them they convert object to string, when in fact you should do the opposite.

Friend you have an object at hand. To manipulate the object you use the syntax:

*object[key] ou object.key*

In your case it will be:

console.log( data[0]['id'] );

To insert this data into a DIV or any element, you can do this in N ways. It may be by the CLASS selector or by the selector ID, there are other ways to do it, but in principle these are the ones. You can read the Jquery documentation for more details.

link

Good friends studies.

In this data you are receiving a JSON. In case it is still in String you can convert it to Array. From there it's simple. An example could look like this:

data = typeof data == 'string' ? JSON.parse(data) : data; // para garantir que o formato é correto
// e depois:
data.forEach(... etc 

Example:

[{
    "id": "769",
    "cidade": "minhacidade",
    "estado": "PR"
}, {
    "id": "855",
    "cidade": "Caram",
    "estado": "PR"
}].forEach(function(elementoDaArray) {
    var div = document.createElement('div'); // criar o elemento
    div.id = elementoDaArray.id; // dar-lhe o ID do objeto
    div.innerHTML = JSON.stringify(elementoDaArray); // dar-lhe conteúdo
    document.body.appendChild(div); // inserir no DOM
});

Example: link

If you want to use jQuery to do the same might be like this :

$('<div/>', {
    id: elementoDaArray.id,
    html: JSON.stringify(elementoDaArray)
}).appendTo(document.body);

Instead of $.get you could use $.getJSON that already gives you a JSON. To iterate the object you receive you can use data.forEach(function(... as I did above, or a for loop.

Resolved I changed the way I call, for $ .getJSON.

$.getJSON( "http://meusite.com/", function( data ) {
//console.log(data);

console.log(data[0]['cidade']);
console.log(data[1]['cidade']);

});

This method returns me an obejto (the other a text).

With this I was able to access each index. With console.log (date [1] ['city']);

It worked.

Also with $ get worked out fine. So I'll leave the two ways you need.

$(document).ready(function(){
    $.get( "http://meusite.com/", function( data ) {


data = typeof data == 'string' ? JSON.parse(data) : data;
data.forEach(function(elementoDaArray) {

    var div = document.createElement('div');

    id = elementoDaArray.id;
    cidade = elementoDaArray.cidade;
  
    console.log(cidade);
    console.log(id);


    //div.innerHTML = JSON.stringify(elementoDaArray);
    //document.body.appendChild(div);


});

$. get is a simplified version of $ .ajax, has fewer parameters. To use json you should use ajax, as it has the datatype parameter, which should be set to json.

in this case:

$.ajax({
method:"get",
dataType:"json",
url:"seusite",
success: function(data){
console.log(data["id"]);
}

N

This example I get the id, for others it's just using date [name].

Embrace