Jquery html属性：如何从该元素的html中排除元素的子HTML

Question

代码段：

<div id="some_text">
    <p>some text</p>

    <div id="child">
        <p>some other text</p>
    </div>

</div

我怎样才能获得“<p>some text</p>”？

Answer 1

$('#some_text:first-child').html(); //contains your text

$('#some_text:first-child').remove(); //to remove

Answer 2

使用replaceWith()：

$("#some_text > p").replaceWith("some other html");

或者如果您需要更具体：

$("#some_text > p:first-child").replaceWith("some other html");

甚至使用not()：

$("#some_text").children().not("#child").replaceWith("some other html");

replaceWith()会将每个匹配的元素替换为特定的HTML，因此如果您匹配的不止一个，您将获得重复的内容。另一种方法是删除它，然后添加所需的HTML。

基本上替换div中的HTML同时维护子元素很难，因为你在哪里放置新的HTML？之前呢？后？周围？你可能需要对此更加具体。

Answer 3

$('#sometext > p')应该可以解决问题。

Answer 4

我尽量避免使用:first-child :parent等:nth孩子的伪选择器，因为IE 7无法识别它。