Манипулирование "данными" из $.ajax success: function (data) {

У меня есть это и простой вопрос.

$.ajax({
    type: "POST",
    url: "/",
    data: $(".form").serialize(),
    dataType: "html",
    success: function (data) {
        $("#id").html(data);
    }
});

Внутри "данных" находится некоторый html, который я вставляю в DOM. Это не проблема. Но я хочу манипулировать "данными", прежде чем делать это. Как я могу это сделать? Например, в "данных" есть некоторые элементы li. Как я, например, удаляю последний элемент li из строки данных, прежде чем вставлять его в DOM?

Я пробовал что-то вроде

$(data li:last)remove();

... но это не сработало.

Спасибо за вашу помощь.

Ответ 1

Вам не нужен скрытый DIV. Если вы хотите преобразовать строку html в фрагмент DOM, просто вызовите jQuery на нем. В вашем примере:

success: function(data) {
    var jqObj = jQuery(data);
    jqObj.find("li:last").remove();
    $("#id").empty().append(jqObj);
}

Некоторые соображения IE:

Если ваши данные большие, jQuerifying его на месте медленнее в IE (по крайней мере, с jQuery 1.2.6). В этом случае вам может понадобиться создать контейнер для него, как var div = jQuery("<div/>"); div.html(data);, затем обработать его там, прежде чем делать $("#id").html(div.html()).
Если ваши данные имеют недопустимый HTML (закрытые теги и т.д.), вы можете получить странные неудачи в IE. Просто убедитесь, что html хорошо сформирован.

Ответ 2

Вы можете создать объект jQuery из произвольного HTML, например:

$('<ul><li>Item</li></ul>');

Итак, вы можете сделать что-то вроде этого:

success: function(data) {
  var $list = $(data);

  $list.find('li:last').remove();

  // Do something with $list here, like append().
}

Вот рабочий пример, на котором вы можете играть с JS Bin: http://jsbin.com/ejule3/edit

Ответ 3

Возвращаемые данные представляют собой строку и не могут быть найдены в dom через jQuery, пока он фактически не появится в DOM. Вам нужно будет разобрать эту строку и вытащить нужные вам данные или отредактировать ее после вставки в DOM.

Ответ 4

Jay answer прав - вам нужно сначала вставить HTML-данные в DOM (или проанализировать строку, которая кажется громоздкой). Что вы можете сделать, это добавить данные в скрытый DIV, изменить его, затем скопировать данные в другой элемент DOM или просто показать DIV