使用包含其他元素的td的jQuery替换td中的文本

Question

我的表格如下:

<table id='demoTable'>
   <tr>
       <td>8: Tap on APN and Enter <B>www</B>.
           <INPUT id=h150000000000000109743 class=hid value="test value" type=hidden>
           <INPUT id=h250000000000000109743 class=hid1 value="26,222,98,10,50000000000000109744,T,~25,221,99,10,,T,www" type="hidden">
       </td>
   </tr>
</table>

我想只更改文本8: Tap on APN and Enter <B>www</B>.
而不影响隐藏的字段

我正在尝试jQuery但没有找到解决方案

function changeText() {
    $("#demoTable td").each(function () {
        for (var i = 0; i < $(this).children.length; i++) {
            alert($(this).children(i).val());
        }
        // alert($(this).html());
        // $(this).text("hello");
        // alert($(this).html());
    });
}

Answer 1

在jquery中使用文本节点是一项特别精细的工作,大多数操作都是完全跳过它们.

而不是经历小心避免错误节点的麻烦,为什么不在<span>for例中包装你需要替换的内容:

<td><span class="replaceme">8: Tap on APN and Enter <B>www</B>.</span></td>

然后:

$('.replaceme').html('Whatever <b>HTML</b> you want here.');

Answer 2

删除文本节点，并在<b>不接触输入的情况下用您需要的任何内容替换标签：

$('#demoTable').find('tr > td').contents().filter(function() {
    return this.nodeType===3;
}).remove().end().end()
  .find('b').replaceWith($('<span />', {text: 'Hello Kitty'}));

小提琴

Answer 3

$('#demoTable td').contents().each(function() {
    if (this.nodeType === 3) {
        this.textContent
        ? this.textContent = 'The text has been '
        : this.innerText  = 'The text has been '
    } else {
        this.innerHTML = 'changed';
        return false;
    }
})

http://jsfiddle.net/YSAjU/