Question

场景：我希望通过AJAX将元素列表返回给浏览器。使用JAXB进行编组，并且由于XML需要根元素（JSON没有...），我将列表包含在信封（包装器）元素中。现在在客户端（浏览器），我希望删除外部元素，使元素列表保持原样。然后，我希望将提取的元素列表放入HTML Dom中。我怎么能这样做？

澄清的例子：

希望发送：

<tr><td>data</td></tr><tr><td>data</td></tr>

由于text / xml响应类型的限制（为了符合XML），我将其包装为：

<tbody><tr><td>data</td></tr><tr><td>data</td></tr></tbody>

所以在我的jquery回调方法中，我收到了上面的内容（作为xml对象）。我怎么能（除了任何工作之外没有特定的顺序）删除tbody元素，并确保剩余的tr标签是可接受的domData。我玩了find（），filter（）等，但仍然没有满足这两个要求的解决方案。

感谢所有已经回复的人！这个真让我烦恼。如果不测试所有提供的答案，就会有多种方法可以做到这一点，并且可能每个答案都可以标记为正确答案。我实际上是这样做的：

 }).done(function(xmlResponse) {
    $strData = xmlToString(xmlResponse);
    $html = $($strData);
    $('#mytable tbody').html($html.contents());
 });

出于某种原因，如果没有显式的callout将xml首先转换为字符串，它就不起作用了。然后，将字符串包装在$（）内部强制它符合DOM，然后使用contents（）方法处理外部元素的提取（删除）。

这是xmlToString（）方法。如果有人能够指出我如何能够消除这种丑陋方法的需要那么这绝对是一个奖励。它看起来像2009年之前的html应用程序：

function xmlToString(xmlData) { 
  var xmlString;
  if (window.ActiveXObject){
     xmlString = xmlData.xml;
  } else{
     xmlString = (new XMLSerializer()).serializeToString(xmlData);
  }
  return xmlString;
}

我将第一个答案标记为正确，因为它足以让我超越终点线。

Answer 1

试试这个 -

$(xml).find('tbody').contents().unwrap();

Working Demo

Answer 2

找到tbody的孩子们。想象'data'变量包含通过ajax收到的数据：

var $shard = $(data).children();

$('.something').append($shard);

说明：

$(data) // creates the dom shard.
$(data).children(); // selects it's children, which is everything except the tbody

Answer 3

您可以使用replaceWith将其替换为其子项（保留它们）：

$(xml).children("tbody").replaceWith($(xml).children("tbody").children());

Answer 4

您可以使用.contents()来提取根元素的内容：

$html = $('<tbody><tr><td>data</td></tr><tr><td>data</td></tr></tbody>');
$html.contents().appendTo('#something-else');

如何删除AJAX XML Response的外部元素

4 个答案: