如何在不删除span的情况下更改html段落内容？

在从jQuery用户界面下面的例子，我们有一个提示框：如何在不删除span的情况下更改html段落内容？

<div class="ui-widget"> 
    <div class="ui-state-error ui-corner-all" style="padding: 0 .7em;"> 
     <p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span> 
     Alert: something went wrong</p> 
    </div> 
</div>

我希望能够不删除这需要警告图标的照顾部分编辑警报文本...但还没有在javascript中编写所有的小部件html。

如果我做了类似$('p').html("new alert")的操作，它将删除span（图标）部分。如果我使用$('p').text("new alert")，也会发生同样的情况。

任何想法我可以做到这一点？

来源

2013-02-18 Sagi Mann

尝试了这一点http://jsfiddle.net/euFUL/

HTML

<div class="ui-widget"> 
    <div class="ui-state-error ui-corner-all" style="padding: 0 .7em;"> 
     <p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span> 
      <span id="ErrorMsg">Alert: something went wrong</span> 
     </p> 
    </div> 
</div>

$(function() { 
    $('#ErrorMsg').text("new alert"); 
});

来源

2013-02-18 08:07:29

是的，这似乎为我工作:) – 2013-02-18 13:15:35

-1

使用jQuery特殊选择:not()

来源

2013-02-18 08:05:47 kicaj

因为你不能选择纯文本这是没有用的，它必须是有效的HTML元素。 – 2013-02-18 08:10:38

你可以使用一个内部的div元素，并把文本上

<div><span></span><div id="innerDiv"></div></div>

来源

2013-02-18 08:07:13

你可以而改变你的HTML结构，但如果你不想，试试这个：

var $p = $('p'); 
$p.find('span').appendTo($p.html('Not an alert anymore'));

http://jsfiddle.net/tRMyq/

来源

2013-02-18 08:09:09

如何在不删除span的情况下更改html段落内容？

回答

相关问题