정적 JSON 데이터를 사용하기위한 깔끔한 솔루션

Question

간단한 JavaScript (jQuery) 슬라이드 쇼를 개발 중입니다. JSON을 사용하여 각 슬라이드의 내용에 대한 일부 정적 매개 변수를 저장하려고했습니다.

내 데이터를 내 코드와 별도로 보관하고 싶기 때문에 JavaScript가 .json 파일을 평가하게하려면 어떻게해야합니까?

• AJAX는 약간 과장된 것처럼 보입니다. 런타임시 평가할 필요가 있으며 동적 인 것은 없습니다.
• 개체로 내 JSON 데이터를 보유하는 별도의 .js 파일을 가질 수 있습니다. 그러나 이것은 지저분 해 보입니다.

그래서 위의 솔루션 중 하나를 사용하기 전에 JavaScript로 텍스트 파일을 평가하는 더 깨끗한 방법이 없도록하고 싶었습니다.

Answer 1

개체에 대해 별도의 js 파일을 갖는 것이 잘못된 이유는 무엇입니까? 그것은 어딘가에 살아야합니다. 나는 아약스가 잔인하다고 생각하지만, 왜 .js 파일의 JavaScript 객체가 "지저분한"것이라고 생각하는지 모르겠다. JSON을 평가

Answer 2

은 매우 간단합니다 :이 데이터를 저장하는

var jsonString = "{'name': 'Joe', 'age': 36}"; 

var data = eval('(' + jsonString + ')'); 
data.name // 'Joe' 
data.age // 36 

가장 쉬운 방법은 <input type="hidden">에 넣어 다음 document.getElementById('hiddenElementId').value를 사용하여 읽는 것입니다.

---

전체 사진 :

HTML

<input type="hidden" id="hiddenElementId" value="{'name': 'Joe', 'age': 36}" /> 

JS는

function getData() { 
    var jsonString = document.getElementById('hiddenElementId').value; 
    var data = var data = eval('(' + jsonString + ')'); 
    return data; 
} 

그것은 hidden 요소가 될 실제로 필요가 없습니다 - 당신은 그것을 넣을 수 있습니다 이미지 중 하나의 속성

---

또 다른 옵션은 특정 이름으로 <script> 태그에 부착하는 것입니다.

<script type="text/javascript"> 
    var data = {'name': 'Joe', 'age': 36}; 
</script> 

이 방법 data 전역 변수와 모든 곳에서 사용할 수있다 (내가 그렇게 많이 좋아하지 않는 무언가를)된다. 그것은 간단한 해결책이지만 약간 지저분한 - 나는 첫 번째 것과 함께 갈 것입니다.

Answer 3

J-쿼리는 깔끔한처럼 만드는 방법도 IE에서 작동하는 구문 분석 JSON 기능 ..

$.parseJSON("{'json':'rules for data'}"); 

즐기 ..

그러나 다만 질문이 있습니다

FUNCTION_HOWTO({json:'test',p2:'part2'}) = { 
    json:'test', 
    p2:'part two' 
}