Jquery find（）元素，然後刪除它

Question

我有一個var，我正在嘗試編輯html。我想將類「文件」的UL移動到它自己的var，然後從數據var中移除它。

我有這個目前爲止，但做錯了。我似乎無法理解它。

var data = '<ul class="dirs"><li class="d"><a href="#" rel="/Games/">Games</a></li><liclass="d"><a href="#" rel="/Log/">Log</a></li></ul><ul class="files"><li class="f"><a href="#">fubar.txt</a></li><li class="f"><a href="#">fubar2.txt</a></li></ul>'; 

var files = $(data).find("UL.files").html(); 

預期結果：

data = '<ul class="dirs"><li class="d"><a href="#" rel="/Games/">Games</a></li><li class="d"><a href="#" rel="/Log/">Log</a></li></ul>'; 

files = '<ul class="files"><li class="f"><a href="#">fubar.txt</a></li><li class="f"><a href="#">fubar2.txt</a></li></ul>'; 

感謝

Answer 1

不能修改字符串，但您可以創建新的字符串。

var data = '<ul class="dirs"><li class="d"><a href="#" rel="/Games/">Games</a></li><liclass="d"><a href="#" rel="/Log/">Log</a></li></ul><ul class="files"><li class="f"><a href="#">fubar.txt</a></li><li class="f"><a href="#">fubar2.txt</a></li></ul>'; 

var ul1 = $(data).filter('ul')[0]; 
var ul2 = $(data).filter('ul')[1]; 

var files1 = ul1.outerHTML || $('<div>').append(ul1).html(); 
var files2 = ul2.outerHTML || $('<div>').append(ul2).html(); 

這會將新的UL元素爲ul1和ul2。然後要獲取html字符串，請使用.outerHTML屬性。

由於Firefox不支持outerHTML，因此需要進行破解才能使其符合瀏覽器。

輸出示例：http://jsfiddle.net/bjgLV/

Answer 2

我發現$(data)不產生你想要的整個HTML。嘗試運行$(data).html()

輸出："<li class="d"><a href="#" rel="/Games/">Games</a></li><liclass="d"><a href="#" rel="/Log/">Log</a></liclass="d">"

Answer 3

看看這個：HTTP：//jsfiddle.net/kcAn3/

你早前曾力通過W3C驗證方案，我的代碼猜測jQuery的帳目中

Answer 4

試試這個

var data = '<ul class="dirs"><li class="d"><a href="#" rel="/Games/">Games</a></li><liclass="d"><a href="#" rel="/Log/">Log</a></li></ul><ul class="files"><li class="f"><a href="#">fubar.txt</a></li><li class="f"><a href="#">fubar2.txt</a></li></ul>'; 

var $uls = $(data).filter("ul").wrap("<div>"); 

data = $uls.first().parent().html(); 
file = $uls.last().parent().html();