使用jQuery將列表項目（LI）分組爲OL/UL

Question

使用Javascript和jQuery或正則表達式，可以像HTML中一樣對HTML中的多個兄弟列表項進行分組嗎？我需要將TikiWiki標記轉換爲HTML，並且它使用未分組列表（只是附加＃的相鄰行）。

<li>Item 1.1</li> 
<li>Item 1.2</li> 
<li>Item 1.3</li> 
<p>Paragraph</p> 
<li>Item 2.1</li> 
<li>Item 2.2</li> 

要這樣：

<ul> 
<li>Item 1.1</li> 
<li>Item 1.2</li> 
<li>Item 1.3</li> 
</ul> 
<p>Paragraph</p> 
<ul> 
<li>Item 2.1</li> 
<li>Item 2.2</li> 
</ul> 

我已經嘗試過使用$("li").wrapAll()和siblings()。兩個失敗。

還有另一種方法。這裏是我正在用來將TikiWiki列表轉換爲HTML列表項目的正則表達式：replace(/[#](.*)\n?/g, "<li class='numbered'>$1</li>")是否可以匹配重複的模式，並將它們相應地轉換爲HTML，如同這個僞正則表達式？ replace(/repeat([#](.*)\n?)/g, "<ol>foreach(<li class='numbered'>$1</li>)</ol>")

Answer 1

這是我的第一個破解。這可能讓你在正確的方向

<div id='testList'> 
     <li>Item 1.1</li> 
     <li>Item 1.2</li> 
     <li>Item 1.3</li> 
     <p>Paragraph</p> 
     <li>Item 2.1</li> 
     <li>Item 2.2</li> 

    </div> 

<script language='javascript' type='text/javascript'> 

$.fn.tagName = function() { 
    return this.get(0).tagName; 
} 

$(document).ready(function() { 

    alert($("#testList").html()); 

    $("li").each(function() { 
     if ($(this).parent().tagName() != "UL") { 
      $(this).wrap("<ul></ul>"); 
      // alert($(this).parent().tagName()) 
     } 
    }) 

    alert($("#testList").html()); 
}); 
</script> 

Answer 2

的<p>只是掛在一堆<li>s中間去，表示一組的開頭或結尾？那麼，也許是這樣的：

​$('div#container') // assume you're got it in a container div 
    .find('p').each(function(){ // each p signifies a new group 
    $(this) 
     .prev('li') // walk back to the preceding li 
     .prevUntil('p') // get the set of elements up to the previous p 
     .andSelf() // include the current li 
     .wrapAll('<ul>');​​​​​​​​​​​​​​​​​​​​​​​​​​ // wrap the set in a ul 
    }); 

這裏有一個working jsFiddle使用這種方法。