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

时间:2012-06-27 05:49:34

标签: jquery

如何获取此标记中的文字?

<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>

1 个答案:

答案 0 :(得分:1)

完成编辑:

我明白了。您将无法将纯文本移动到该“P”标记中,因此您需要在具有类/ ID的另一个P中说明它。在这种情况下,我会给它一个班级。你也不能只有一个随机的“

”。这会破坏html。所以我只是改为:“&lt; p&gt;”所以它会变成文本而不是与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