操作$ .ajax成功的"数据":function(data){

Question

我有这个和一个简单的问题.

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

里面的"数据"是我插入DOM的一些html.那没问题.但是我想在这之前操纵"数据".我怎样才能做到这一点？例如,"data"中有一些li元素.例如,在将数据插入DOM之前,我将如何删除"data"字符串中的最后一个li元素？

我试过类似的东西

$(data li:last)remove();

......但那没有用.

谢谢你的帮助.

Answer 1

您不需要隐藏的DIV.如果要将html字符串转换为DOM片段,只需在其上调用jQuery即可.在你的例子中:

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

一些IE考虑因素:

• 如果你的数据很大,那么j在IE中就地进行查询的速度很慢(至少使用jQuery 1.2.6).在这种情况下,你可能想为它创建一个容器,var div = jQuery("<div/>"); div.html(data);然后在做之前操作它$("#id").html(div.html()).
• 如果您的数据包含无效的HTML(未封闭的标签等),您可能会在IE中遇到奇怪的故障.只要确保html格式正确.

Answer 2

您可以从任意HTML创建jQuery对象,例如:

$('<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

Answer 3

返回的数据是一个字符串,通过jQuery无法在dom中找到,直到它实际上在DOM中.您将需要解析此字符串并提取所需的数据,或在插入DOM后对其进行编辑.