更新與HTML多種元素從jQuery的AJAX調用

我有一個AJAX調用，它返回的是需要更換的頁面上的多個HTML片段：更新與HTML多種元素從jQuery的AJAX調用

<div data-replace="some-div"> 
    <p>whatever</p> 
</div> 

<div data-replace="some-other-div"> 
    <p>something else</p> 
</div>

目前，我將所有的HTML到一個隱藏的div在頁面上然後這樣做：

hiddenDiv.find('[data-replace]').each(function() { 
     $('#' + $(this).data('replace')).html($(this).html()); 
     $(this).remove(); 
    });

這似乎工作，但似乎有點hacky。

有沒有更好的方法（雖然仍然返回HTML而不是JSON，因爲這是超出我的控制）？

來源

2013-05-27 Paul Hiles

林不知道你會提出怎麼回事不是將其存儲在一個片段來做到這一點其他JS變量。你不能只填寫需要直接更新的div嗎？ –

當你說直接填充時，我將如何做到這一點的給定格式的響應？據我所知，我需要解析響應來解決這個問題（在這個例子中）＃some-div和＃some-other-div需要更新。 –

那麼你可以，因爲它的HTML使用普通的舊javascript來選擇高速緩存中的DOM元素，然後修改DOM innerHTML屬性中的div。或者，您正在使用jQuery，爲什麼不使用它來選擇正確的HTML並插入到DOM中？ –

我會創建一個包含所有DOM元素的jQuery對象，並且不會將它們作爲隱藏的DIV元素附加到文檔中，因爲您不需要它。您也不需要在更新後將其刪除。

事情是這樣的：

（假設你的Ajax響應是一個變量稱爲數據）

var $data = $("<div>" + data + "</div>"); 
$data.find('[data-replace]').each(function() { 
    $('#' + $(this).data('replace')).html(this.innerHTML); 
});

來源

2013-05-27 13:10:55 letiagoalves

不錯。謝謝。這似乎比添加DOM來操作更好。所以，在幕後，這只是在內存中完成，jQuery可以通過DOM以相同的有效方式查詢變量？ –

@TheFlowerGuy是的。官方文檔說你可以在這個對象上執行任何常用的jQuery方法。 – letiagoalves

更新與HTML多種元素從jQuery的AJAX調用

回答

相關問題