在保存图标时动态更改Twitter Bootstrap按钮上的文本？

Question

如何在不破坏图标的情况下使用javascript/jquery更改Twitter Bootstrap中按钮上的文本？

所以,这是我的静态标记:

<a class="btn" id="myButton" onclick="doSomething()"><i class="icon-ok"></i> Do it...</a>

我可以更改图标,如下所示:

$('#myButton i:first-child').attr('class','icon icon-remove');

这很好,但是对于所有好的爱,我找不到设置按钮文本的方法,而不会消除图标.例如.如果我这样做:

$('#myButton').text('Some Remove Text');

我丢失了图标元素,那么如何才能访问文本并对其进行编辑,同时保留任何子元素？

Answer 1

您可以将内容包装在span元素中,然后在锚点的上下文中找到它.

$('#myButton span').text('Some Remove Text');

你也可以使用$('#myButton i:first')代替$('#myButton i:first-child')甚至

$('#myButton i') or $('#myButton > i') which would be shorter.