或許是我“入世太淺”,在使用append,prepend以及之類的對dom元素位置進(jìn)行操作的方法進(jìn)行列表排序時,發(fā)現(xiàn)了一個有意思的小陷阱。
當(dāng)時的功能需求是,點擊排序按鈕,列表依據(jù)某數(shù)據(jù)從大到小排序,再次點擊時,取消排序復(fù)原列表。我的思路是,專門寫一個ul用來放置有序列表,來回toggle無序和有序列表即可。
很快,排序函數(shù)寫完了,但是我發(fā)現(xiàn),再次點擊,無序列表并沒有顯示。再次點擊排序,有序列表正常顯示。我以為是toggle方法不兼容,可是有序列表有效啊。我使用css()來改變‘display’屬性,結(jié)果還是無效。因為開發(fā)平臺聯(lián)機調(diào)試時無法在IDE上實時預(yù)覽,我沒法審查元素來看看到底發(fā)生了什么,而且沒有斷點調(diào)試功能。各種方法試遍,還是不行。
打印。我打印了ul的個數(shù),沒錯,兩個。在該顯示無序列表的時候,我打印了它里邊li的個數(shù),我暈,0!也就是append之類的方法直接移動了被選中的元素,而不是復(fù)制!就像大學(xué)時候一哥們到我們宿舍:“有電影沒有,我拷幾個。你懂的?!比缓髱滋旌笙落佇值苣囊槐橛忠槐榇蜷_每一個可能的文件夾并自言自語哎我去我的蒼老師呢。沒錯,那哥們的拷,是剪切。
無序列表的li被直接剪切到新建好的有序列表了那自然就成了空列表所以兩個列表正常切換了只不過原無序列表變成了空表。
于是我在append之前加了一步,定義一個數(shù)組,數(shù)組元素與無序列表里的li一一對應(yīng),不再對他們直接操作。在有序列表插入的是數(shù)組里的元素。這總可以吧,又沒有動它們。然后,一樣的結(jié)果。我甚至$T = $(this);$('.sortList').append($T);依然不行。
也就是說,在一個頁面中將dom元素賦值給其他變量,那么原有dom元素,就不復(fù)存在了?。個人理解,未查證,歡迎指正。
jquery對dom元素進(jìn)行移動操作時的小小陷阱
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。
相關(guān)閱讀更多精彩內(nèi)容
- 【蝴蝶效應(yīng)】 蝴蝶效應(yīng):上個世紀(jì)70年代,美國一個名叫洛倫茲的氣象學(xué)家在解釋空氣系統(tǒng)理論時說,亞馬遜雨林一只蝴蝶...