jQuery appentTo和重置/重新排序位置函數？

我使用appendTo（）來追加一個「div」幾個「img」標籤，這似乎很有效。現在如果我想刪除一個圖像並對它們進行重新排序呢？爲了讓自己更清晰，我將圖像div保存在一個數組中。當我從該數組中刪除一個元素時，我也希望「視覺」圖像被重新排序。所以我有這樣的：jQuery appentTo和重置/重新排序位置函數？

[img_1] [img_2] [img_3] -> in a div

現在

如果我刪除「圖像格」 2我想這樣的：如果你有一個

[img_1]  [img_3] -> in a div

來源

2012-03-22 Test Test

告訴我們你如何做添加/刪除..（* html＆js *） – 2012-03-22 00:57:41

如果你刪除了一個''你得到了什麼**實際** html？ – zerkms 2012-03-22 00:58:09

：

[img_1] [img_3] -> in a div

而不是此包含圖像的陣列，並且您希望從陣列中移除圖像並將其從DOM中移除，您可以創建一個像這樣的功能來爲您執行兩種操作：

var imgArray = [img1, img2, img3]; 

function removeImage(array, index) { 
    array[index].parentNode.removeChild(imgArray[index]); // remove from DOM 
    array.splice(index, 1);         // remove from array 
} 

removeImage(imgArray, 1);

該函數的第一行從DOM中刪除數組中的第二個元素。

該函數的第二行從數組中刪除第二個元素。

僅供參考，你可能想知道的jQuery使得它很容易獲得那些在任何DIV的圖像列表，它常常是，你並不需要保存圖像的平行排列的情況下在JavaScript中。如果你想要一個div中的圖像列表，你可以隨時使用jQuery和正確的選擇器來獲取它。

舉例來說，如果你有這樣的HTML：

<div id="container"> 
    <img src="xxx"> 
    <img src="yyy"> 
    <img src="zzz">  
</div>

你可以在任何時候獲得的圖像列表與這個jQuery：

$("#container img")

而且，你可以刪除第二圖像與此：

$("#container img").eq(1).remove();

來源

2012-03-22 01:00:07 jfriend00

當你說「從DOM中刪除它」會自動重新排列圖像還是會出現空白點？ – 2012-03-22 01:54:22

@TestTest - 除非您在圖像上執行了絕對定位的操作，否則當您從DOM中移除其他圖像時，瀏覽器將重新定位其他圖像。如果你向我們展示你的HTML/CSS，我們可以更具體地回答。 – jfriend00 2012-03-22 02:13:32

jQuery appentTo和重置/重新排序位置函數？

回答

相關問題