html 코드에서 json 파일을 사용하는 방법

json 파일 mydata.json이 있으며이 파일에는 json으로 인코딩 된 일부 데이터가 있습니다.html 코드에서 json 파일을 사용하는 방법

이 데이터를 index.html 파일로 가져 와서이 데이터를 JavaScript로 처리하고자합니다. 하지만 .html 파일의 .json 파일을 연결하는 방법을 모르겠습니까?

말해주십시오. 나는 HTML 페이지의 테이블에 데이터를 표시 할 수 있도록, 내 HTML에서이 파일을 사용하는 방법을 서버에서 JSON 파일을 얻고있다

{ 
    "items": [ 
     { 
      "movieID": "65086", 
      "title": "The Woman in Black", 
      "poster": "/kArMj2qsOnpxBCpSa3RQ0XemUiX.jpg" 
     }, 
     { 
      "movieID": "76726", 
      "title": "Chronicle", 
      "poster": "/853mMoSc5d6CH8uAV9Yq0iHfjor.jpg" 
     } 
    ] 
}

생각 : 은 여기 내 JSON 파일입니다. json 파일을 파싱하려면 JavaScript를 사용하고 있습니다. 나는이 분야에 새로운 사람이다. 제발 도와주세요. jQuery의 $.getJSON

$.getJSON('mydata.json', function(data) { 
    //do stuff with your data here 
});

출처

2012-08-22 saikiran

안녕 abc.json, 당신은 당신의 질문에 자세한 내용을 추가하는 것이 좋습니다. 자바 스크립트 프레임 워크를 사용하고 있습니까? (예 : jQuery) 당신은 이미 무엇을 시도 했습니까? 원하는 최종 결과는 무엇입니까? 명확한 목표를 가진 좋은 질문은 지역 사회에서 좋은 답변과 사례를 얻는 데 도움이 될 것입니다. 질문 아래의 '수정'링크를 사용하여 수정하십시오. – BenSwayne

http://api.jquery.com/jQuery.java/ –

예제를 얻을 수없는 링크도 살펴보십시오. 정교하게주세요. – saikiran

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script> 

<script> 

    $(function() { 


    var people = []; 

    $.getJSON('people.json', function(data) { 
     $.each(data.person, function(i, f) { 
      var tblRow = "<tr>" + "<td>" + f.firstName + "</td>" + 
      "<td>" + f.lastName + "</td>" + "<td>" + f.job + "</td>" + "<td>" + f.roll + "</td>" + "</tr>" 
      $(tblRow).appendTo("#userdata tbody"); 
    }); 

    }); 

}); 
</script> 
</head> 

<body> 

<div class="wrapper"> 
<div class="profile"> 
    <table id= "userdata" border="2"> 
    <thead> 
      <th>First Name</th> 
      <th>Last Name</th> 
      <th>Email Address</th> 
      <th>City</th> 
     </thead> 
     <tbody> 

     </tbody> 
    </table> 

</div> 
</div> 

</body> 
</html>

내 JSON 파일이

{ 
    "person": [ 
     { 
      "firstName": "Clark", 
      "lastName": "Kent", 
      "job": "Reporter", 
      "roll": 20 
     }, 
     { 
      "firstName": "Bruce", 
      "lastName": "Wayne", 
      "job": "Playboy", 
      "roll": 30 
     }, 
     { 
      "firstName": "Peter", 
      "lastName": "Parker", 
      "job": "Photographer", 
      "roll": 40 
     } 
    ] 
}

내가 그것을 하루 작업 후 테이블을 html로하는 JSON 파일을 integratig에 succeded있어

출처

2012-08-23 12:03:36 saikiran

로컬 json 파일 인 경우 어떻게해야합니까? –

people.json은 로컬 JSON 전용입니다. $ .getJSON – saikiran

사용!

출처

2012-08-23 05:19:51

내 HTML 파일에서 jquery .. 제발 도와주세요! 나는 전체 코드를 원한다. 내 HTML 페이지의 테이블에 내 데이터를 표시하고 싶습니다. 샘플 코드를 제공하십시오. 그래서 나는 쉽게 이해할 수있다. 기대 해줘서 고마워요. – saikiran

감사합니다. 내 대답이 ... – saikiran

당신은 은 그냥 JSON 파일의 적절한 경로를 제공 ... 같은 자바 스크립트를 사용할 수 있습니다 ...

<!doctype html> 
<html> 
    <head> 
     <script type="text/javascript" src="abc.json"></script> 
      <script type="text/javascript" > 
       function load() { 
        var mydata = JSON.parse(data); 
        alert(mydata.length); 

        var div = document.getElementById('data'); 

        for(var i = 0;i < mydata.length; i++) 
        { 
         div.innerHTML = div.innerHTML + "<p class='inner' id="+i+">"+ mydata[i].name +"</p>" + "<br>"; 
        } 
       } 
     </script> 
    </head> 
    <body onload="load()"> 
    <div id= "data"> 

    </div> 
    </body> 
</html>

간단히 처음 인쇄 ... 데이터를 얻고 사업부에 추가

길이 경보.

여기 내 JSON 파일입니다

data = '[{"name" : "Riyaz"},{"name" : "Javed"},{"name" : "Arun"},{"name" : "Sunil"},{"name" : "Rahul"},{"name" : "Anita"}]';

출처

2017-07-31 19:53:57 javed

abc.json 올바른 json 파일, 해당 실제 자바 스크립트, 그래서 여기에 그냥 자바 스크립트 파일 "abc.json"호출하고로드하는 로컬 json 절대 URL을 제공하십시오 ... –

If 이 "JSON"에서 JavaScript 변수에 배열을로드하려면 바깥 쪽 작은 따옴표 만 제거하면됩니다. 이 경우'data'는'name' 속성을 가진 객체를 포함하는 배열입니다. 이 경우에는'JSON.parse()'가 필요 없다. –

html 코드에서 json 파일을 사용하는 방법

답변

관련 문제