Использование jQuery для изменения ответа AJAX

Question

Когда вызов AJAX возвращает html, возможно ли использовать jQuery для изменения содержимого строки ответа? Если да, то как это сделать?

EDIT:

Этот вопрос направлен на редактирование ответа перед записью его на страницу

Answer 1

Ну, это зависит от того, как вы запрашиваете данные. Если у вас есть $ .ajax и т. Д., Вы можете внести необходимые изменения в обработчик успеха. Я предполагаю, что поскольку вы не очень хорошо понимаете jQuery, вы используете $ .load () для загрузки данных, и в этом случае проще всего заменить его на

$.get('/somecode.php', function(data) {
    data = $(data);

    // Find and remove all anchor tags for example
    data.find('a').remove();
    $('#target-id').append(data);
});

Или, если вы не хотите создавать объект jQuery, вы можете легко сделать что-то вроде

$.get('/somecode.php', function(data) {
    // Replace all strings "foo" with "bar" for example
    data = data.replace('foo', 'bar');

    // Manually append it to DOM or do whatever you want with it
    $('#target-id').append(data);
});

Answer 2

Если вы используете jquery 1.5+, вы можете использовать ajax datafilter.

Функция обратного вызова dataFilter вызывается сразу после успешного получения данных ответа.> Он получает возвращенные данные и значение dataType и должен возвращать (возможно> измененные) данные для успешной передачи.

Пример кода:

$.ajaxSetup({
    dataFilter: function (response, type) {
        response = response.replace(/username/g, 'Sina Salek');
        return response;
    }
});

https://api.jquery.com/jquery.ajax/

Answer 3

в функции обратного вызова, которая выглядит как

function(response){
  response = //edit response here
  $("#content").html(response);
}

Answer 4

Вы можете редактировать содержимое возвращенных данных с помощью jQuery, преобразовав сами данные в объект jquery.

$.get(file.html, function(data){

    var $obj = $('<div>').html(data); //explaination of this below

    $obj.find("span").remove(); //just an example, this removes all the SPANs

    $("#destination").html($obj.first('div').html());
});

Обратите внимание, что вам нужно обернуть возвращенные данные в DIV, прежде чем редактировать ихпотому что, если ваши возвращенные данные не имеют допустимого корневого узла в структуре HTML, объект jQuery не сможет выполнить модификацию с помощью find и других функций.

По этой причине рекомендуется переноситьвозвращенные данные, измените их, а затем разверните перед вставкой в ​​целевой HTML-узел.

Answer 5

Отредактировано по рекомендации Maxedison по точности:

Вы можете напрямую манипулировать возвращаемой строкой, как указано в genesis (нет необходимости делать это в JQuery), или вы можете воссоздать новый вывод, проанализировав html, используя вспомогательную библиотеку, такую ​​как jParse:

http://jparse.kylerush.net/demo

Answer 6

Нет. jQuery будет работать только с элементами DOM. Поэтому до тех пор, пока они не будут созданы из строки, все, что у вас есть, это ... строка.

Могу я спросить, почему вы беспокоитесь об этом? Если это проблема производительности (то есть вы создаете тонну DOM-элементов с помощью ответа AJAX, а затем редактируете многие из них с помощью jQuery), то есть вероятность, что ваш PHP-скрипт должен быть изменен, чтобы получить более желательный ответ. Если проблема заключается в том, что вы не хотите, чтобы пользователи видели ответ до тех пор, пока JQuery не выполнит изменения DOM, просто вставьте все это в скрытый div (отображение: нет), пока изменения не будут завершены.

Редактировать - 1 исключение В jQuery есть функция $ .trim (), которая удаляет пробелы в начале и конце строки. Не уверен, есть ли другие.