如何使用 jquery / Javascript 将段落合并到父链接中？答案

【问题标题】：How to merge paragraphs into parent link with jquery / Javascript?如何使用 jquery / Javascript 将段落合并到父链接中？
【发布时间】：2012-04-04 21:30:00
【问题描述】：

我该如何转这个：

<a class="link">
   <p class="paragraph">This is some text</p>
   <p class="paragraph">This is some more text</p>
   <p class="paragraph">And some more</p>
</a>

进入这个：

<a class="link">
   This is some text This is some more text And some more
</a>

使用 jQuery。我尝试使用追加和合并，但我就是想不通。

【问题讨论】：

标签： javascript jquery merge append

【解决方案1】：

由于text 方法返回元素的文本内容及其后代，您可以直接使用它：

var link = $("a.link");
link.text(link.text());

来自文档：

获取匹配集合中每个元素的组合文本内容元素，包括它们的后代。

这是working example。

更新（见 cmets）

如果这需要应用于多个.link元素，可以使用each：

$("a.link").each(function() {
    $(this).text($(this).text()); 
});

【讨论】：

但是如果a.link 匹配多个元素会怎样？
@FrédéricHamidi - 然后它将用所有文本替换每个文本。我假设这仅适用于一个元素。见编辑。
太好了，我确实需要它来处理多个元素

【解决方案2】：

这将起作用：

$("a.link").text(function(i,text){
    return text;
});

还有另一种方式（未测试）：

// you can optionally filter to
// only p elements too with
// .children("p")
$("a.link").children().contents().unwrap();

这是第二个的另一种变体：

$("a.link p").contents().unwrap();

编辑：只是为了清楚起见：
所有这些解决方案都适用于多个元素。第一个解决方案是一种相对不常见的语法，可用于大多数 jQuery setter 函数。它在每个匹配的元素上运行回调，并将属性/属性的值设置为从回调返回的值。

【讨论】：

【解决方案3】：

试试这个

    $(document).ready(function(){
      var concatText = "";

      $("p.paragraph").each(function(){
       concatText = concatText + " " + $(this).text() 
      });

        $("a.link").html(concatText);
     });

【讨论】：