除了一般包装器中的一个外,.wrapAll

时间:2013-07-16 17:00:49

标签: javascript jquery wrapper wrapall

我有一组生成的divs宽度相同的类,它包含一个标题和一系列链接。由于某种原因,最后隐藏了一个标题。

它们看起来像这样:

<div class="wrapper">
  <label class="Descr">List Header </label>
  <a href="#">List item </a>
  <a href="#">List item </a>
  <a href="#">List item </a>
  <a href="#">List item </a>
  <label class="Descr2" style="display:none">Hidden List Header</label>
</div>
<div class="wrapper">
  <label class="Descr">List Header </label>
  <a href="#">List item </a>
  <a href="#">List item </a>
  <a href="#">List item </a>
  <a href="#">List item </a>
  <label class="Descr2" style="display:none">Hidden List Header</label>
</div>

我得到了大约三到四个这样的例子。请注意,我无法更改代码。

现在我想在div中的每个父级中包含achors,以便能够向其添加jQuery滚动。

但是使用.wrapAll这样的东西会将所有锚点移动到一个div中并清空其他div。

jQuery('.wrapper a').wrapAll('<div class="content"></div>');
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="wrapper">
  <label class="Descr">List Header </label>
  <div class="content">
    <a href="#">List item </a>
    <a href="#">List item </a>
    <a href="#">List item </a>
    <a href="#">List item </a>
    <a href="#">List item </a>
    <a href="#">List item </a>
    <a href="#">List item </a>
    <a href="#">List item </a>
  </div>
  <label class="Descr2" style="display:none">Hidden List Header</label>
</div>
<div class="wrapper">
  <label class="Descr">List Header </label>

  <label class="Descr2" style="display:none">Hidden List Header</label>
</div>

任何人都知道我如何能够单独定位div,即使我只定义了一般的课程并让他们留在父母的内部?

1 个答案:

答案 0 :(得分:4)

$('.wrapper').each(function() { 
    $('a', this).wrapAll('<div class="content"></div>');
});