删除<a> inside <h2> and use the text to fill a <p></p></h2></a>

Question

我有这个Bootstrap片段：

<h2>My Records <a href="#" class="btn btn-primary">Add new</a></h2>
<p></p>

我想从<a>中移除<h2>标记，仅保留“裸”文本（“我的记录”）以填充<p>标记，从而产生此标记：

<h2>My Records <a href="#" class="btn btn-primary">Add new</a></h2>
<p>My Records</p>

我做了这个小提琴但得到了错误的结果：http://jsfiddle.net/3fptd/1/

1. <a>标记已从输出页面中的<h2>中删除
2. <p>填充了“添加新”文字而不是“我的记录”

请，任何帮助？
谢谢！

Answer 1

您想要h2的第一个孩子的内容，请尝试

$("p").text(function () {
    return $("h2").prop('firstChild').nodeValue;
})

演示：Fiddle

Answer 2

您收到<a>的文字而不是<h2>的文字。

更正版本：

$( "p" ).text(function(){
    var h2 = $( "h2" );
    h2.find( "a" ).remove();
    return h2.text();
});

更正小提琴：http://jsfiddle.net/3fptd/2/

Answer 3

看看这个

$( "p" ).text(function(){
    header = $( "h2" ).find( "a" ).remove();
    return $( "h2" ).text();    
})

http://jsfiddle.net/chetangawai/3fptd/5/

Answer 4

你删除<a>因为删除了删除完整元素。这就是你在做的事情：

1. 获取<a>元素的文字。
2. 删除<a>元素。

我认为那是你要求的......

$( "p" ).text(function(){
    var header = $("h2").text().split("Add new");
    return header[0];    
})