Javascript 与FV或Google Chrome相比，在IE中替换DOM元素的速度较慢

我正在使用的应用程序需要快速响应。客户端应该通过填写表单来创建配置。表单上的每次修改都会将表单发送给服务器进行验证。服务器用一个新的HTML页面进行响应。然后在浏览器中呈现该页面。我的任务是将Ajax添加到这个过程中，以便改进用户体验。以下是我迄今为止所做的工作：

function doSubmitWithAjax(){
  var datum = $('#hiddenvars').serialize();
  var ajax=$.ajax({
    type : 'POST',
    url : 'frontend',
    cache : false,
    dataType : 'html', 
    data : datum 
  });
  ajax.success(function(XHR,text,jqXHR){
    var dom = document.createElement('div');
    dom.innerHTML=XHR;
    var bod = $('#hiddenvars',dom);
    $('#hiddenvars').replaceWith(bod);
  });
  ajax.error(function(jqXHR, textStatus, errorThrown){
    alert('request error '+errorThrown);
  });
 }

XHR是从服务器接收的HTML页面。基本上，我只想检索表单hiddenvars并将其放置在DOM中，而不是已经存在的表单

每次表单中发生更改时，都会触发doSubmitWithAjax函数。目前的实现在Firefox和Chrome上运行良好。IE的响应时间太长。我使用了一些工具来检查需要花费那么多时间的东西，结果表明，replaceWith比FF0.2秒慢1.3秒

我的问题：如何提高IE的响应时间？我可以用什么来代替替换？我尝试过：$'hiddenvars'.empty.replaceWithbod；因为我不需要从DOM中替换表单，但仍然很慢

谢谢

在我看来：

var bod = $('#hiddenvars',dom);
$('#hiddenvars').replaceWith(bod);

用自身替换hiddenvars。查看以下内容是否更快：

var x = document.getElementById('hiddenvars');
var p = x.parentNode;
p.innerHTML = '';
p.appendChild(x);
p.appendChild(bod);

您可能还希望保留对bod的引用，以便每次只替换其内容，而不是每次删除和插入HiddenVar

编辑 不幸的是，您不能在元素上使用getElementById，您需要筛选dom的内容才能找到它。使用dom.getElementsByTagName'form'至少意味着您只需筛选表单，例如

var form, forms = bod.getElementsByTagName('form');
var i = forms.length;
while (i-- && !form ) { 
  if (forms[i].id == 'hiddenvars') form = forms[i];
}

if (form) {
  var x = document.getElementById('hiddenvars');
  x.parentNode.replaceChild(form, x);
}

---

恭喜你，你发现IE比它更现代的同类产品慢得多。1欺骗：缓存请求，因此如果一个请求使用data:1，下一个是data:1，那么直接从js中的缓存获取结果，而不是从服务器获取结果。2.2.你已经在做一些基本的事情来加快速度。避免使用dom构建东西，使用replace/clone。我不明白为什么我不喜欢你的代码。可能是var bod=$'hiddenvars'，dom；$'hiddenvars'.replaceWithbod；，还有一种更简单的方法来做同样的事情，那就是不要让IE生气。没有理由为每一个小小的表单更改将整个表单发送给服务器。IE可能很慢，但您的设计有缺陷。@ZippyV:表单被发送到服务器，因为所有字段都根据当前的输入修改进行了调整。如果有100个字段，并且用户修改了第53个字段，那么可能会根据第53个字段上的选择修改另外20个字段。这是它背后的逻辑，都是遗留代码。我真的做不了太多。你能简化HTML吗？删除内联样式、重复类并更改css文件？var bod=$'hiddenvars'，dom；从包装从服务器接收的XHR的dom对象获取表单。$'hiddenvars'替换为BOD；接受我的当前表单，并将其替换为从服务器接收的更新表单。无论如何，你的建议似乎是有效的，因为它没有使用替换，而根据dynaTrace，替换基本上是瓶颈。我会尝试一下。谢谢。再次感谢！它实际上更快。