选择不是链接的列表项

Question

我必须使用jquery将内容管理系统中用户输入的无序列表转换为引导菜单(导航栏).

80%除了一个挑战,我无法找到一个很好的解决方案 - 即一个使用选择器而不是字符串操作或正则表达式.毕竟,我们都知道我们永远不会用正则表达式解析html :)

因此,使用用户可以使用的有限UI工具,它们会生成一个列表,通常是两级嵌套列表,如下所示

<ul>
 <li>Blah1
  <ul>
   <li><a href='http://xxxx'>Blah1a</a></li>
   <li><a href='http://yyyy'>Blah1b</a></li>
   <li>Blah1c</li>
   <li><a href='http://zzzz'>Blah1d</a></li>
  </ul>
 </li>
 <li><a href='http://aaaa'>Blah2</a></li>
 <li>Blah3
  <ul>
   <li><a href='http://xxxx'>Blah2a</a></li>
   <li><a href='http://yyyy'>Blah2b</a></li>
  </ul>
 </li> 
</ul>

等等...重要的是,他们的一些列表项是链接,有些只是文本.

我需要选择<li>中包含的每个文本块,这些文本块尚未包含在<a>中并将其包装在<a href="#">中,以便将上述内容转换为:

<ul>
 <li><a href='#'>Blah1</a>
  <ul>
   <li><a href='http://xxxx'>Blah1a</a></li>
   <li><a href='http://yyyy'>Blah1b</a></li>
   <li><a href='#'>Blah1c</a></li>
   <li><a href='http://zzzz'>Blah1d</a></li>
  </ul>
 </li>
 <li><a href='http://aaaa'>Blah2</a></li>
 <li><a href='#'>Blah3</a>
  <ul>
   <li><a href='http://xxxx'>Blah2a</a></li>
   <li><a href='http://yyyy'>Blah2b</a></li>
  </ul>
 </li> 
</ul>

应该不是那么难,我敢肯定,但经过一个小时的演奏,我无处可去.

Answer 1

尝试

$('li').contents().filter(function(){
    return this.nodeType == 3 && $.trim($(this).text()).length > 0
}).wrap('<a href="#" />')

演示：小提琴