动态地分配值给dom

我有一个html页面，它将显示用户配置文件的用户名，地点，等等。我在jquery中使用ajax获取值。现在我有问题，如何获取的值分配给DOM：动态地分配值给dom

第一种方法会等到我得到的数据，然后动态地创建DOM和附加到目标DIV

$.ajax({ 
    url: "profiledata", 
    type: "POST", 
    success:function(data){ 
     $("<div><label>"+data.name</label><br/> 
      <label>"+data.place</label></div>").appendTo("target div"); 
    }

在这种方法更追加的字符串将会发生，所以我怀疑进程所消耗的内存。

方法二将只使用ID来赋值：

$.ajax({ 
    url: "profiledata", 
    type: "POST", 
    success:function(data){ 
      $("#uname").text(data.name); 
      $("#place").text(data.place); 
    } 

<div><label id="uname"></label><br/> 
<label id="place"></label></div>

哪一个将是有效的在加载页面的条款，即较轻的代码和页没有我提到的一些写的方法呢？或者有更好的解决方案吗？

来源

2013-05-02 manish

其中6个是另外6个，取决于您的使用情况，哪个更具可读性。我不相信会有任何**显着差异的表现。 – Liam 2013-05-02 16:01:51

在第一种方法中，所有的'“

"+data.name
"+data.place

”'必须在被追加之前由jQuery解析。我会说第二个更有效率。 – Ian 2013-05-02 16:01:51

根据项目的复杂性，使用许多Javascript MV *框架中的一个可能是值得的，它允许您轻松地将DOM绑定到数据源。一些例子是[Knockout.js]（http://knockoutjs.com/），[AngularJS]（http://angularjs.org/）和[Backbone.js]（http://backbonejs.org/）。这些允许您只从服务器提取数据，而不必担心更新DOM;该框架为你做到了这一点。 – jmeas 2013-05-02 16:06:33

取决于用例，两种解决方案都有优点和缺点。

第一种方法：

，直到你需要他们
但它也有JQuery的在内存中创建的元素，而不是修改页面上的元素不加载的元素。

第二种方法：

也没有创造这样修改标记的元素是因为我们并不寻求在js HTML更容易一些。
现在我们必须记住隐藏要素，如果我们不希望用户看到他们

哪一种方法，我会使用，将取决于各种因素。一般来说，我更喜欢第二种，因为当我想修改标记时，我没有在javascript中查找。

来源

2013-05-02 16:04:39 Schleis

这是否意味着如果我有一些像用户配置文件一样的固定DOM，我们应该使用第二种方法，如果它的动态DOM像显示不断变化的注释那样应该使用第一种方法 – manish 2013-05-02 16:08:53

作为一般规则，是的，像那样。 – Schleis 2013-05-03 00:03:27

重复操作DOM常常涉及开销。从这个角度来看，第一种方法似乎更合适。就ajax调用的速度而言，数据在这两种方法中都以相同的方式检索，您可以使用.ajaxStart()和.ajaxStop()来“加载”某种效果。

来源

2013-05-02 16:03:10 Paras

动态地分配值给dom

回答

相关问题