Я использую JSON для передачи данных.
Что мне нужно на моей HTML-странице для чтения файла с Ajax, который включает только один объект JSON в мой script?
Нужен ли мне jQuery или можно загрузить этот файл JSON с помощью Ajax?
В разных браузерах он отличается?
Вам не нужна библиотека, все доступно в java файле vanilla для извлечения json файла и его анализа:
function fetchJSONFile(path, callback) {
var httpRequest = new XMLHttpRequest();
httpRequest.onreadystatechange = function() {
if (httpRequest.readyState === 4) {
if (httpRequest.status === 200) {
var data = JSON.parse(httpRequest.responseText);
if (callback) callback(data);
}
}
};
httpRequest.open('GET', path);
httpRequest.send();
}
// this requests the file and executes a callback with the parsed result once
// it is available
fetchJSONFile('pathToFile.json', function(data){
// do something with your data
console.log(data);
});
Наиболее эффективным способом является использование обычного JavaScript:
var a = new XMLHttpRequest();
a.open("GET","your_json_file",true);
a.onreadystatechange = function() {
if( this.readyState == 4) {
if( this.status == 200) {
var json = window.JSON ? JSON.parse(this.reponseText) : eval("("+this.responseText+")");
// do something with json
}
else alert("HTTP error "+this.status+" "+this.statusText);
}
}
a.send();
В прошлом Ajax отличался в разных браузерах (и все еще есть, если вам нужно поддерживать старые браузеры, к которым, к сожалению, пока еще используется большое количество пользователей). Для старых браузеров вам понадобится библиотека JQuery (или ваш собственный эквивалентный код) для обработки различий браузера. В любом случае, для новичков я мог бы рекомендовать jQuery для хороших документов, простого API и быстро начать работу, хотя MDN полезен для JavaScript (и вам действительно нужно все чаще понимать API JavaScript/DOM, даже если вы в первую очередь полагаетесь на jQuery).
Я предпочитаю использовать ajax jquery. JQuery делает жизнь намного проще.
Что вы, например, можете делать на стороне сервера, я предполагаю, что вы используете php:
if (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest'){
// if it an ajax request
$json['success'] = 1;
$json['html'] = '<div id="test">..[more html code here].. </div>';
echo json_encode($json);
}else{
// if it an non ajax request
}
На стороне клиента вы можете сделать следующее с помощью jquery ajax:
$.ajax({
type: "POST",
url: "[your request url here]",
data: { name: "JOKOOOOW OOWNOOO" },
complete: function(e, xhr, settings){
switch(e.status){
case 500:
alert('500 internal server error!');
break;
case 404:
alert('404 Page not found!');
break;
case 401:
alert('401 unauthorized access');
break;
}
}
}).done(function( data ) {
var obj = jQuery.parseJSON(data)
if (obj.success == 1){
$('div#insert_html_div').html(obj.html);
}else if (obj.error == 1){
}
// etc
});