那些遇到过的问题

标签: wrapall

如何在下一次出现相同元素之前包装每个元素及其所有同级元素？

我有一些类似于以下内容的标记：

<h3>A Heading</h3>
<p>Here is a paragraph.</p>

<ul>
  <li>First</li>
  <li>Second</li>
</ul>

<blockquote>Here's some other block-level element</blockquote>

<h3>The Wrapping Should Stop Before This Heading, but a Second One Should Begin</h3>
<ol>
  <li>First</li>
  <li>Second</li>
</ol>

<p>Notice the varying block-level elements? It probably doesn't make any difference.</p>
Run Code Online (Sandbox Code Playgroud)

我想将所有h3内容（但不包括下一个）包装h3在一个div.

结果应该是：

<div>
  <h3>A Heading</h3>
  <p>Here is a paragraph.</p>

  <ul>
    <li>First</li>
    <li>Second</li>
  </ul>

  <blockquote>Here's some other block-level element</blockquote>
</div>

<div>
  <h3>The Wrapping Should Stop Before This Heading, but a Second …
Run Code Online (Sandbox Code Playgroud)

javascript jquery siblings selector wrapall

Cur*_*ell
2019 04-20
5
推荐指数
1
解决办法
1409
查看次数

用DIV包装HTML直到下一个H3

我有以下HTML结构:

$('#subgroup a').nextUntil('h3').wrapAll('<div></div>');
Run Code Online (Sandbox Code Playgroud)

我有这种扁平结构,因为我想使用jQuery UI的手风琴效果.我想在a元素之间包装所有h3元素.

没试好我试过以下内容:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="subgroup">
  <h3>Group name #1</h3>
  <a href="#">Link #1</a>
  <a href="#">Link #2</a>
  <h3>Group name #2</h3>
  <a href="#">Link #3</a>
  <a href="#">Link #4</a>
</div>
Run Code Online (Sandbox Code Playgroud)

但这导致一些a元素消失.我尝试了很多选择器,但没有一个能够工作.我这样做了吗？

html javascript jquery wrapall

reb*_*ion
2019 04-20
4
推荐指数
1
解决办法
3322
查看次数

使用jQuery将连续列表项包装在不同的组中

我有一个由CMS导出的无序列表,需要识别<li>具有类.sub的元素并将它们包装在一个<ul>.

我已经尝试了该wrapAll()方法,但它找到所有<li class="sub">元素并将它们包装在一个中<ul>.我需要它来维持单独的分组.

导出的代码如下:

<ul>
  <li></li>
  <li></li>
  <li></li>
  <li class="sub"></li>
  <li class="sub"></li>
  <li class="sub"></li>
  <li></li>
  <li></li>
  <li class="sub"></li>
  <li class="sub"></li>
  <li class="sub"></li>
  <li></li>
 </ul>
Run Code Online (Sandbox Code Playgroud)

我需要它:

<ul>
  <li></li>
  <li></li>
  <li></li>
  <ul>
     <li class="sub"></li>
     <li class="sub"></li>
     <li class="sub"></li>
  </ul>
  <li></li>
  <li></li>
  <li></li>
  <ul>
     <li class="sub"></li>
     <li class="sub"></li>
     <li class="sub"></li>
   </ul>
   <li></li>
   <li></li>
</ul>
Run Code Online (Sandbox Code Playgroud)

任何帮助将不胜感激.

jquery grouping elements wrapall

Luc*_* JD
2012 01-27
4
推荐指数
2
解决办法
1533
查看次数

如何包装h1并跟踪div中的内容？

我需要知道如何包装h1并跟踪div中的内容.这是原始结构:

<h1>Title #1</h1>
<p>Text</p>
<p>Text</p>

<h1>Title #2</h1>
<p>Text</p>
<p>Text</p>
<p>Text</p>

<h1>Title #3</h1>
<p>Text</p>
Run Code Online (Sandbox Code Playgroud)

这是我想得到的结果:

<div>
  <h1>Title #1</h1>
  <p>Text</p>
  <p>Text</p>
</div>

<div>
  <h1>Title #2</h1>
  <p>Text</p>
  <p>Text</p>
  <p>Text</p>
</div>

<div>
  <h1>Title #3</h1>
  <p>Text</p>
</div>
Run Code Online (Sandbox Code Playgroud)

html javascript jquery wrapall

gee*_*way
2019 04-24
3
推荐指数
1
解决办法
637
查看次数

用div包裹所有元素

我浏览过这个网站但没有找到我的答案。我正在尝试将所有 div 包装到一个包装器中。到目前为止，我能使用wrapAll 做的就是在每个div 周围添加一个容器。我不想那样做。我有这个

 <div class="container-fluid">
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
     <div class="panel-cell">Content</div>
 </div><!--END container-fluid-->
Run Code Online (Sandbox Code Playgroud)

我需要把它变成这样

 <div class="container-fluid">
     <div class="container">
         <div class="panel-cell">Content</div>
         <div class="panel-cell">Content</div>
         <div class="panel-cell">Content</div>
         <div class="panel-cell">Content</div>
     </div><!--END container-->
 </div><!--END container-fluid-->
Run Code Online (Sandbox Code Playgroud)

这可以用Jquery 来做吗？

html jquery wrapall

Jam*_*mie
2017 08-09
3
推荐指数
1
解决办法
2247
查看次数

用Jquery中的其他div包装几个div

我有几个div如下: 

<div id='id1'>blabla</div>
<div id='id2'>blabla</div>
<div id='id3'>blabla</div>
<div id='id4'>blabla</div>
<div id='id5'>blabla</div>
<div id='id6'>blabla</div>
Run Code Online (Sandbox Code Playgroud)

我想添加一个新的div(<div id='newdiv'>),以包装我指定的div; 例如在'id3'之前和'id5'之后.所以我们得到:

<div id='id1'>blabla</div>
<div id='id2'>blabla</div>
<div id='newdiv'>
  <div id='id3'>blabla</div>
  <div id='id4'>blabla</div>
  <div id='id5'>blabla</div>
</div>
<div id='id6'>blabla</div>
Run Code Online (Sandbox Code Playgroud)

你知道jQuery代码吗？

提前致谢 !

javascript jquery wrapall

Arn*_*slt
2019 04-20
2
推荐指数
1
解决办法
65
查看次数

jQuery:只包装第一个和第二个孩子,而不是其他孩子

在我的实际代码中:

<div id="mother">
  <div id="child-01"></div>
  <div id="child-02"></div>
  <div id="child-03"></div>
  </ul>
Run Code Online (Sandbox Code Playgroud)

我需要生产:

<div id="mother">
  <div id="myWrap">
    <div id="child-01"></div>
    <div id="child-02"></div>
  </div>
  <div id="child-03"></div>
  </ul>
Run Code Online (Sandbox Code Playgroud)

我正在玩包裹,wrapAll和孩子,但我卡住了.

提前致谢.

哇,谢谢!

还有一件事,如果在我的实际代码中,我有:

<div id="mother">
  <div id="child-01"></div>
  <div id="child-02"></div>
  <div id="child-03"></div>
  </ul>

  <div id="uncle">
    <div id="cousin-01"></div>
    <div id="cousin-02"></div>
    <div id="cousin-03"></div>
    </ul>
Run Code Online (Sandbox Code Playgroud)

我如何生产:

<div id="mother">
  <div id="myWrap">
    <div id="child-01"></div>
    <div id="child-02"></div>
    <div id="cousin-02"></div>
  </div>
  <div id="child-03"></div>
  </ul>
Run Code Online (Sandbox Code Playgroud)

谢谢.

javascript jquery children wrapall

jos*_*oma
2019 04-20
1
推荐指数
1
解决办法
3800
查看次数

如何包装所有相邻且具有相同类的元素？

我想知道如何包装所有相邻且具有相同类的元素。.wrapAll()不起作用，因为它将段落推到了底部。

来源：

<div class="container">
  <div class="group"></div>
  <div class="group"></div>
  <div class="group"></div>

  <p>Lorem ipsum dolor sit amet</p>

  <div class="group"></div>
  <div class="group"></div>
  <div class="group"></div>
</div>
Run Code Online (Sandbox Code Playgroud)

期望的输出：

<div class="container">
  <div class="group-wrapper">
    <div class="group"></div>
    <div class="group"></div>
    <div class="group"></div>
  </div>

  <p>Lorem ipsum dolor sit amet</p>

  <div class="group-wrapper">
    <div class="group"></div>
    <div class="group"></div>
    <div class="group"></div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

javascript jquery grouping wrapall

mha*_*ici
2019 04-20
1
推荐指数
1
解决办法
1951
查看次数

使用JQuery在Div中包含多组元素

我正在开发一个下拉菜单,需要使用JQuery改变现有的html标记,使其适合设计.

这是一个简化的例子:在div中包含所有"ul",其中包含多个"li"(在同一个div中,每个UL不包含一个div).

<ul>
    <li>foo</li>
</ul>
<ul>
    <li>foo</li>
    <li>foo</li>
</ul>
<ul>
    <li>foo</li>
    <li>foo</li>
</ul>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script>
my_selection = [];
i = 0;
// find all ul's that have more than one li
$("ul").each(function(){
    if($(this).find("li").length > 1){
        // add this to my_selection
        my_selection[i] = $(this);
        i++;
    } // if
}); // each

// wrap my_selection in div tags
$(my_selection).wrapAll(document.createElement("div"));
</script>
Run Code Online (Sandbox Code Playgroud)

上面的代码给出了这个firebug错误:

"节点无法插入层次结构中的指定点"代码:"3"

我怎样才能使它工作？

jquery css-selectors wrapall

edt*_*edt
2015 08-08
0
推荐指数
1
解决办法
4402
查看次数

Jquery按属性查找元素集并将它们包装在新的div中

我有一堆<ul>具有data-year属性的s.我想在div中包含具有相同值的data-year属性,如下所示:<div class="year"><div>

之前:

<div class="projectLists">
    <ul data-year="2013">
        <li>items ...   
    </ul>
    <ul data-year="2013">
        <li>items...
    </ul>
    <ul data-year="2012">
        <li>items ...
    </ul>
    <ul data-year="2012">
        <li>items ...
    </ul>
    <ul data-year="2011">
        <li>items...
    </ul>
    <ul data-year="2011">
        <li>items...
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

之后应该是这样的:

<div class="projectLists">
<div class="year">
    <ul data-year="2013">
        <li>items ...
    </ul>
    <ul data-year="2013">
        <li>items...
    </ul>
</div>
<div class="year">
    <ul data-year="2012">
        <li>items ...
    </ul>
    <ul data-year="2012">
        <li>items...
    </ul>
</div>
<div class="year">
    <ul data-year="2011">
        <li>items ...
    </ul>
    <ul data-year="2011">
        <li>items...
    </ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)

我已经尝试过多次包装每次ul并且没有预期的结果:

$('.projectList ul').each(function(){
        var …
Run Code Online (Sandbox Code Playgroud)

javascript jquery wrapall

作者
lucky-day
0
推荐指数
1
解决办法
1234
查看次数

如何包装所有下一个元素直到？

我有以下 html：

\n\n

\r\n
\r\n
<div class="menuItem">Dom\xc5\xaf</div>\r\n<div class="menuItem">O n\xc3\xa1s</div>\r\n<div class="menuItem">V\xc3\xbdzkum a v\xc3\xbdvoj</div>\r\n<div class="submenuItem"><b>Aplikace aktivn\xc3\xadho gumov\xc3\xa9ho pr\xc3\xa1\xc5\xa1ku</b>\r\n</div>\r\n<div class="submenuItem"><b>Odpra\xc5\xa1ky</b>\r\n</div>\r\n<div class="submenuItem"><b>Guma</b>\r\n</div>\r\n<div class="submenuItem"><b>Zem\xc4\x9bd\xc4\x9blstv\xc3\xad</b>\r\n</div>\r\n<div class="submenuItem"><b>Potravin\xc3\xa1\xc5\x99stv\xc3\xad</b>\r\n</div>\r\n<div class="menuItem">Projek\xc4\x8dn\xc3\xad \xc4\x8dinnost</div>\r\n<div class="menuItem">Realizace</div>\r\n<div class="submenuItem"><b>realizace podstr\xc3\xa1nka</b>\r\n</div>\r\n<div class="menuItem">Kontakty</div>
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n\n

我想要实现的目标是.menuItem用. 不幸的是，以下 js 包装了整个片段，而不是上面定义的集合。.submenuItem.menuSet

\n\n

\r\n
\r\n
<div class="menuItem">Dom\xc5\xaf</div>\r\n<div class="menuItem">O n\xc3\xa1s</div>\r\n<div class="menuItem">V\xc3\xbdzkum a v\xc3\xbdvoj</div>\r\n<div class="submenuItem"><b>Aplikace aktivn\xc3\xadho gumov\xc3\xa9ho pr\xc3\xa1\xc5\xa1ku</b>\r\n</div>\r\n<div class="submenuItem"><b>Odpra\xc5\xa1ky</b>\r\n</div>\r\n<div class="submenuItem"><b>Guma</b>\r\n</div>\r\n<div class="submenuItem"><b>Zem\xc4\x9bd\xc4\x9blstv\xc3\xad</b>\r\n</div>\r\n<div class="submenuItem"><b>Potravin\xc3\xa1\xc5\x99stv\xc3\xad</b>\r\n</div>\r\n<div class="menuItem">Projek\xc4\x8dn\xc3\xad \xc4\x8dinnost</div>\r\n<div class="menuItem">Realizace</div>\r\n<div class="submenuItem"><b>realizace podstr\xc3\xa1nka</b>\r\n</div>\r\n<div class="menuItem">Kontakty</div>
Run Code Online (Sandbox Code Playgroud)\r\n
\r\n
\r\n

\n\n

为了让我的意图更容易理解，下面我发布了期望的结果：

\n\n

\r\n
\r\n
$(".menuItem").nextUntil(".menuItem").andSelf().wrapAll("<div class=\'menuSet\'></div>");
Run Code Online (Sandbox Code Playgroud)\r\n
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>\r\n<div class="menuSet">\r\n  <div class="menuItem">Dom\xc5\xaf</div>\r\n</div>\r\n<div class="menuSet">\r\n  <div …
Run Code Online (Sandbox Code Playgroud)

html javascript jquery wrapall

Bea*_*eau
2019 04-22
0
推荐指数
1
解决办法
3969
查看次数

标签 统计

jquery ×11

wrapall ×11

javascript ×8

html ×4

grouping ×2

children ×1

css-selectors ×1

elements ×1

selector ×1

siblings ×1