Javascript 从单独的html页面创建dom元素

我有一个web应用程序，它使用javascript大量操纵DOM元素，根据特定事件创建新的UI。随着应用程序的发展，客户端渲染变得越来越慢，我正在寻找一种改进的方法。具体来说，我想创建一个DOM元素，它是在服务器端完全呈现的html页面的克隆，然后将此元素插入现有的web应用程序中。这将是插入一个大DOM元素，而不是大量操作许多小元素。这是我的想法，但我不确定这是否可能，如果可能，我该怎么做？如果不可能，是否有更好的方法将大部分客户端渲染工作移动到服务器

谢谢，

---

H

我认为这里要使用的是AJAX，也称为XMLHttpRequest

函数getRequesturl、callbackFunction、目标 { var-httpRequest； ifwindow.XMLHttpRequest { //现代网络浏览器 httpRequest=新的XMLHttpRequest； } else ifwindow.ActiveXObject { //旧的微软浏览器 尝试 { httpRequest=新的ActiveXObject MSXML2.XMLHTTP； } 抓住e { 尝试 { httpRequest=新的ActiveXObject Microsoft.XMLHTTP； } 捕获e{} } } 如果！httpRequest { 警报“AJAX调用失败！请确保您使用的是受支持的web浏览器！”； 返回false； } 打开'get'，url，true； httpRequest.onreadystatechange=函数 { var完成=4，成功=200； ifhttpRequest.readyState==已完成 { ifhttpRequest.status==成功 { var数据=httpRequest.responseText； 调用函数数据，目标； } 其他的 { 警告“请求有问题”； } } } httpRequest.sendnull；

---

} 当然，让您的服务器按名称呈现组件。比如widget1.html

widget1.html可能包含

<div class="widget1-wrapper">
   widget elements here
</div>

在包含页面中，添加

<iframe src="widget1.html" id="widget1" class="hide"></iframe>
<script>
  $(function(){
     $('#widget1').load(function(){
        var myWidget1Object = $(this).contents().find('.widget1-wrapper').clone(true);
     });
  });
</script>

---

由于服务器无法将DOM元素发送到浏览器将读取为tagsoup的纯浏览器文本，我无法理解这个问题，因为您似乎想要一个“常规”phpetc。地点除此之外，您可能希望查看和/或克隆节点，包括其子节点，但不包括属性：cloneNodetrue；。您可以通过AJAX/JSON发送原始html字符串，以防止页面重新加载。这就是你想要的吗？此外，您还可以使用不同的处理线程webworker来生成html并将其传回。