1

考虑以下代码：

<ul>
  <li>Home

    <ol>
      <li>One
        <ol>
          <li>Beta</li>
        </ol>
      </li>
    </ol>
  </li>
</ul>

我想将LI标签自动包装在标签中span，但只是标签，而不是 child LI，如下所示：

<ul>
  <li><span>Home</span>

    <ol>
      <li><span>One</span>
        <ol>
          <li><span>Beta</span></li>
        </ol>
      </li>
    </ol>
  </li>
</ul>

但是玩了一会儿之后，我不确定这是否可能。我试图沿着这些思路：

$('.hierarchy li').wrapInner('<span />');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li>Home

    <ol>
      <li>One
        <ol>
          <li>Beta</li>
        </ol>
      </li>
    </ol>
  </li>
</ul>

但是随后s中的所有内容都包含在. 这是可能的，还是我需要使用的东西？LI<span>wrapInner();

4

1 回答 1

2

使用 是不可行的.wrapInner()，您可以.filter()使用.childeNodes，然后将.textNodes. 请注意，它假定所有匹配项.nextNodes都应该用 span 包装。

$('ul li').contents().filter(function() {
    return this.nodeType === 3 && $.trim(this.nodeValue).length;
}).wrap('<span/>');

http://jsfiddle.net/5WnJ4/

于 2013-09-15T11:52:36.977 回答