A apresentação está carregando. Por favor, espere

A apresentação está carregando. Por favor, espere

JSON Programação de Script. O que é JSON: JavaScript Object Notation. JSON e um padrão de troca de armazenamento e troca de dados. JSON é similar ao XML.

Apresentações semelhantes


Apresentação em tema: "JSON Programação de Script. O que é JSON: JavaScript Object Notation. JSON e um padrão de troca de armazenamento e troca de dados. JSON é similar ao XML."— Transcrição da apresentação:

1 JSON Programação de Script

2 O que é JSON: JavaScript Object Notation. JSON e um padrão de troca de armazenamento e troca de dados. JSON é similar ao XML porem mais compacto, mais rapido e mais simples de utilizar. E independente de plataforma e linguagem de programação.

3 Exemplo { "employees": [ { "firstName":"John", "lastName":"Doe" }, { "firstName":"Anna", "lastName":"Smith" }, { "firstName":"Peter", "lastName":"Jones" } ] }

4 Por que JSON ? Para utilização de aplicações AJAX, JSON e mais rapido e mais facil que com XML. E um formato de intercambio de dados entre tecnologias distintas.

5 Exemplo com Javascript JSON Object Creation in JavaScript Name: Age: Address: Phone: var JSONObject= { "name":"John Johnson", "street":"Oslo West 555", "age":33, "phone":" "}; document.getElementById("jname").innerHTML=JSONObject.name; document.getElementById("jage").innerHTML=JSONObject.age; document.getElementById("jstreet").innerHTML=JSONObject.street; document.getElementById("jphone").innerHTML=JSONObject.phone;

6 Sintaxe Dado e composto pelo conjunto nome/valor. Dado e separado por virgula. Chaves definem o objeto Colchetes definem uma coleção Exemplo: "firstName" : "John"

7 Tipo de dados number (inteiro ou real) string (entre aspas duplas) boolean (true or false) array (entre colchetes) object (entre chaves) null

8 Objetos Objetos do JSON são escritos entre chaves Objetos podem contem multiplos conjuntos de nomes/valores. Exemplo { "firstName":"John", "lastName":"Doe" }

9 Coleção Uma coleção contem vários objetos e delimitado por chaves. { "employees": [ { "firstName":"John", "lastName":"Doe" }, { "firstName":"Anna", "lastName":"Smith" }, { "firstName":"Peter", "lastName":"Jones" } ] }

10 Coleção Exemplo de acesso a um atributo de um objeto da coleção: Lendo o primeiro objeto: employees[0].firstName + " " + employees[0].lastName; Alterando o atributo de um objeto: employees[0].firstName = "Gilbert";

11 Como Fazer Convertendo um JSON em formato texto em um objeto no javascript: var txt = '{ "employees" : [' + '{ "firstName":"John", "lastName":"Doe" },' + '{ "firstName":"Anna", "lastName":"Smith" },' + '{ "firstName":"Peter", "lastName":"Jones" } ]}'; var obj = eval("(" + txt + ")"); obj.employees[1].firstName;

12 JSON e JQUERY Utilizaremos a função jQuery.getJSON, essa função será responsável por obter os dados contidos no nosso json. jQuery.getJSON( url, [data], [callback] ) url -> A url requisitada (parâmetro obrigatório) [data] -> dados que serão enviados via GET (parâmetro opcional) [callback] -> Função que será executada quando os dados forem carregados com sucesso (parâmetro opcional)

13 JSON e JQUERY Exemplo Fonte de dados: {"codigo":"2","nome":Prof. Norton ","perfil":Professor","horario":"Noite"}

14 JSON e JQUERY $.getJSON( "data.js", function(data){ $('#nome').text(data.nome); $('#perfil').text(data.perfil); $('#horario').text(data.horario); } ); );

15 Jquery – Método POST e JSON Na estrutura da função POST existe um parâmetro opcional que permite definir o tipo de retorno da função de callback $(selector).post(URL,data,function (data,status,xhr),dataType)

16 Parâmetro Data Type "xml" – um documento XML "html" – texto em formato HTML "text" – uma string "script" - Runs the response as JavaScript, and returns it as plain text "json" - Runs the response as JSON, and returns a JavaScript object "jsonp" - Loads in a JSON block using JSONP. Will add an "?callback=?" to the URL to specify the callback

17 Fonte com-jquery/


Carregar ppt "JSON Programação de Script. O que é JSON: JavaScript Object Notation. JSON e um padrão de troca de armazenamento e troca de dados. JSON é similar ao XML."

Apresentações semelhantes


Anúncios Google