jquery - 如何获取未包含任何元素的文本并将其放入 p 元素中

Question

如何获取此标记中的文本？

<div itemprop="description">
  <p>Testing article....</p>
  <div class="inline-image inline_image_240x240">
    <img alt="" title="" src="http://kite.dev.cnngo.com/sites/default/files/imagecache/inline_image_240x240/2012/06/27/600x600_5.png">
    <div class="in-captioninline_image_240x240"></div>
  </div>
  I want this to put inside the blank <p> element below.
  <p></p>
  <p>Another p.....</p>
</div>

我想变成这样。

<div itemprop="description">
  <p>Testing article....</p>
  <div class="inline-image inline_image_240x240">
    <img alt="" title="" src="http://kite.dev.cnngo.com/sites/default/files/imagecache/inline_image_240x240/2012/06/27/600x600_5.png">
    <div class="in-captioninline_image_240x240"></div>
  </div>
  <p>I want this to put inside the blank <p> element below.</p>
  <p>Another p.....</p>
 </div>

Answer 1

完整编辑：

我懂了。您将无法仅将纯文本移动到该“P”标签中，因此您需要在另一个具有类/id 的 P 中说唱它。在这种情况下，我会给它上课。你也不能随便有一个“

" 在那里。这会破坏 html。所以我只是将其更改为："<p>" 所以它会变成文本而不是干扰 HTML

将您的 HTML 更改为：

<div itemprop="description">
  <p>Testing article....</p>
  <div class="inline-image inline_image_240x240">
    <img alt="" title="" src="http://kite.dev.cnngo.com/sites/default/files/imagecache/inline_image_240x240/2012/06/27/600x600_5.png">
    <div class="in-captioninline_image_240x240"></div>
  </div>
  <p class="p">I want this to put inside the blank &lt;p> element below.</p>
  <p></p>
  <p>Another p.....</p>
</div>

您可以使用.next()将其移动到下一个 P ：

var el = $('div[itemprop="description"]').find('.p');
el.next().text(el.text()).prev().remove();

JSFIDDLE