0

I've taken a look at a lot of the questions but couldnt find relevant code to help me. Most of the questions people have asked want a span after the first word but i need to dynamically input a <br /> AND then wrap the rest of the text in a span after the first word of a nav anchor link. Also this will only affect the first (parent) level of li/anchors.

Here is the html:

<nav id="smoothmenu1" class="ddsmoothmenu">

<ul>

<li><a href="index.html" class="current">Home our main page</a></li>

<li><a href="blog.html">Blog latest events</a>
    <ul>
        <li><a href="single.html">Single</a></li>
    </ul>
</li>
<li><a href="about.html">About company, team</a></li>
<li><a href="services.html">Services we offer services</a></li>
</ul>
</nav>

I want the code to spit out like this:

<nav id="smoothmenu1" class="ddsmoothmenu">

<ul>

<li><a href="index.html" class="current">Home  <br /><span>our main page</span></a></li>

<li><a href="blog.html">Blog  <br /><span>latest events</span></a>
    <ul>
        <li><a href="single.html">Single</a></li>
    </ul>
</li>
<li><a href="about.html">About  <br /><span>company, team</span></a></li>
<li><a href="services.html">Services  <br /><span>we offer services</span></a></li>
</ul>
</nav>
4

1 回答 1

0

也许有点像这样：

$("nav > ul > li > a").html(function(i, oldVal) {
   return oldVal.replace(/ .*/, function(match) {
                                   return "<br><span>" + match + "</span>";
   });
});

简单演示：http: //jsfiddle.net/NUReJ/

（上面将把空格放在里面<span>而不是之前<br>，像这样：

<a href="index.html" class="current">Home<br><span> our main page</span>

...但是浏览器将以相同的方式呈现它。或者您可以采用基本思想并对其进行修改以适合自己...）

于 2012-05-15T02:21:42.693 回答