Wordpress:如何添加跨度到菜单

时间:2013-10-24 16:17:46

标签: javascript jquery html css wordpress

我有这样的menuin wordpress: -

<div id="my_custom_class">
 <ul class="my_custom_class">
   <li class="page_item"><a href="#">page_item</a>
 <ul class='children'>
    <li class="page_item child"><a href="#">children</a></li>
 </ul>
   </li>
   <li class="current_page_item"><a href="#">current_page</a></li>
   <li class="current_page_item"><a href="#">current_page</a></li>
   <li class="current_page_item"><a href="#">current_page</a></li>
 </ul>
</div>

这个菜单将在我使用时创建: -

<? wp_nav_menu('menu=header'); ?>

所以我需要任何li有孩子的时候,像这样添加<span></span>标签标签

   <div id="my_custom_class">
     <ul class="my_custom_class">
       <li class="page_item"><span></span><a href="#">page_item</a>
     <ul class='sub-menu'>
        <li class="page_item child"><a href="#">children</a></li>
     </ul>
       </li>
       <li class="current_page_item"><a href="#">current_page</a></li>
       <li class="current_page_item"><a href="#">current_page</a></li>
       <li class="current_page_item"><a href="#">current_page</a></li>
     </ul>

</div>

我该怎么办呢。通过jquery

3 个答案:

答案 0 :(得分:1)

使用.prepend()

<击>

<击>
$('ul.my_custom_class li a').closest('li').prepend('<span></span>');

Live DEMO

<击>

Live DEMO

$('ul.my_custom_class li:has(ul)').prepend('<span></span>');

答案 1 :(得分:0)

通过jQuery?确定:

$('<span></span>').prependTo('ul.my_custom_class li:has(ul)');

请参阅http://api.jquery.com/prependTo/

答案 2 :(得分:0)

如果您不愿意深入了解wordpress的功能,可以使用正则表达式注入<span>元素:

(<li.*class="[^\"]*page_item[^\"]*"[^>]*>)(<a.*</a>[^<]+<ul)

结果:

<div id="my_custom_class">
<ul class="my_custom_class">
<li class="page_item"><span></span><a href="#">page_item</a>
<ul class='children'>
<li class="page_item child"><a href="#">children</a></li>
</ul>
</li>
<li class="current_page_item"><a href="#">current_page</a></li>
<li class="current_page_item"><a href="#">current_page</a></li>
<li class="current_page_item"><a href="#">current_page</a></li>
</ul>
</div>

$1 = <li class="page_item">

$2 = <a href="#">page_item</a><ul

所以你只需preg_replace \1<span></span>\2(你需要在</a>添加反斜杠)

Example on php fiddle(假设我正确生成了链接lol)