다음은 HTML5에서 json 객체를 사용하는 방법을 예제 코드를 통해 소개한 것입니다.
<!DOCTYPE html><html> <head> <meta charset=UTF-8> <meta name=viewport content=width=device-width, height=device-height,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no/> <title>json 객체 사용</title> <link rel=stylesheet href=//g.alicdn.com/de/prismplayer/2.6.0/skins/default/aliplayer-min.css /> <script type=text/javascript src=//g.alicdn.com/de/prismplayer/ 2.6.0/aliplayer-min.js></script> </head> <body> <div class=prism-player id=J_prismPlayer 스타일=위치: 절대></div> <script> var 학생 = { Xiaomin: { 이름: Xiaoming, 학년: 1 }, teemo: { 이름: teemo, 학년: 3 } } 학생 = JSON.stringify(학생); //JSON을 문자열로 변환하고 변수에 저장합니다. console.log(students); localStorage.setItem(students,students);//localStorage에 변수 저장 var newStudents = localStorage.getItem(students); newStudents = JSON.parse(students); //JSON으로 변환 console.log(newStudents); 원본 객체 // 경고(newStudents.length); 경고(newStudents.xiaomin.name); //json 배열 유형 문자열 값 var jsonStr = '[{id:01,open:false,pId:0,name:부서 A},{id:01,open:false,pId:0,name:부서 A},{id:011,open:fals e,pId:01,name:부서 A},{id:03,open:false,pId:0,name:부서 A},{id:04,open:false,pId:0,name:부서 A}, {id:05,open:false,pId:0,name:부서 A}, {id:06,open:false,pId:0,name:부서 A}]'; var jsonObj = JSON.parse(jsonStr); //json 객체로 변환 for(var i=0;i<jsonObj.length;i++){ Alert(jsonObj[i].id) //json에서 값 가져오기} console.log(jsonObj) var jsonStr1 = JSON.stringify(jsonObj) console.log(jsonStr1+jsonStr1) </script> </body></html>보충: Html5에서 JSON 개체와 문자열 간의 상호 변환을 살펴보겠습니다 .
모바일 단말기의 급속한 발전에 직면하여 데이터를 제공하는 방법은 더 이상 이전의 PC-->PC 인터페이스가 아니므로 H5 이전의 JS에서는 이전 H4에서 JS를 JSON으로 사용했습니다. 처리 과정에서 eval 메서드인 eval()이 언급되었습니다. H5에서 JSON과 문자열 간의 변환은 다음과 같습니다.
문자열을 JSON 객체로 변환:
var jsonObj; 함수 myParse(){ var jsonStr=document.querySelector(#txtJsonStr).value;
JSON 객체를 문자열로 변환:
function myStringify(){ var txtJson=document.querySelector(#txtJsonStr); var jsonStr2=JSON.stringify(jsonObj); //jsonObj는 JSON 개체입니다. txtJson.value=jsonStr2;요약
위 내용은 에디터가 소개한 HTML5에서 json 객체를 사용하는 예제 코드입니다. 궁금한 점이 있으시면 메시지를 남겨주시면 에디터가 시간 맞춰 답변해 드리겠습니다. 또한 VeVb 무술 웹사이트를 지원해 주신 모든 분들께 감사드립니다!