javascript - 在指定元素的第一部分和最后一部分插入元素

Question

就目前情况而言，这个问题不太适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持，但这个问题可能会引发辩论、争论、民意调查或扩展讨论。如果您觉得这个问题可以改进并可能重新开放， visit the help center以获得指导。

已关闭 10 年前。

我有这个代码。

<ul class="menu">
    <li class="current_page_item"><a href="http://localhost/wordpress/"     title="Home">Home</a></li>
    <li class="page_item page-item-8"><a href="http://localhost/wordpress/?page_id=8">About</a></li>
    <li class="page_item page-item-23"><a href="http://localhost/wordpress/?page_id=23">Contact</a></li>
    <li class="page_item page-item-7"><a href="http://localhost/wordpress/?page_id=7">Gallery</a></li>
</ul>

我想要的是在ul(.menu)内插入一个span()元素。我想把它放在第一个 li 之前直到最后li里面ul (。菜单)。所以预期的输出应该是这样的。

<ul class="menu">
    <span<> <!-- this is the inserted element -->
    <li class="current_page_item"><a href="http://localhost/wordpress/"     title="Home">Home</a></li>
    <li class="page_item page-item-8"><a href="http://localhost/wordpress/?page_id=8">About</a></li>
    <li class="page_item page-item-23"><a href="http://localhost/wordpress/?page_id=23">Contact</a></li>
    <li class="page_item page-item-7"><a href="http://localhost/wordpress/?page_id=7">Gallery</a></li>
    </span<> <!-- this is the inserted element -->
</ul>

到目前为止我尝试过的是这个。

$(document).ready(function(){
    $('<span>').insertBefore('.menu li:first-child');
    $('</span>').insertBefore('.menu li:last-child');
});

如果您能就此事提供帮助，我将不胜感激。

Answer 1

如果你真的喜欢这样做，这会起作用。

$(document).ready(function () {
    $('ul').wrapInner('<span />');
});

http://jsfiddle.net/mG8yV/1