Une solution soignée pour l'utilisation de données JSON statiques

Question

Je développe un simple diaporama JavaScript (jQuery). Je voulais utiliser JSON pour stocker quelques paramètres statiques sur le contenu de chaque diapositive.

Puisque j'aime que mes données soient séparées de mon code, y a-t-il un moyen pour que JavaScript évalue un fichier .json? AJAX semble un peu exagéré - il suffit de l'évaluer au moment de l'exécution, rien n'est dynamique.

Je pourrais avoir un fichier .js séparé qui contient mes données JSON en tant qu'objet - mais cela semble désordonné. Donc, avant d'utiliser l'une des solutions ci-dessus, je voulais juste m'assurer qu'il n'y avait pas une manière plus propre d'avoir JavaScript évaluer un fichier texte.

Answer 1

Quel est le problème avec un fichier js distinct pour votre objet? Il doit vivre quelque part. Je suis d'accord ajax est exagéré, mais je ne sais pas pourquoi vous pensez qu'un objet JavaScript dans un fichier .js est "désordonné".

Answer 2

L'évaluation JSON est très facile:

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

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

La meilleure façon de stocker ces données est de le mettre dans un <input type="hidden"> puis le lire à l'aide document.getElementById('hiddenElementId').value.

---

L'image complète:

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; 
} 

Il est pas vraiment nécessaire d'être un élément hidden - vous pouvez le mettre dans un attribut de l'une des images.

---

Une autre option consiste à le coller dans un tag <script> sous un nom.

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

De cette façon data devient une variable globale (quelque chose que je ne l'aime pas tellement) et peut être utilisé de partout. C'est une solution simple, mais un peu brouillon - j'irais avec le premier.

Answer 3

J-Query a une analyse syntaxique fonction JSON qui fonctionne même dans IE ..

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

Profitez ..

mais juste une question de savoir comment faire bien rangé comme:

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