Заменить текст внутри td, используя jQuery, содержащий td, содержащий другие элементы

Моя таблица выглядит следующим образом:

<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());
    });
}

Ответы

Ответ 1

Использование текстовых узлов в jquery является особенно деликатной задачей, и большинство операций выполняется, чтобы вообще пропустить их.

Вместо того, чтобы идти навстречу осторожно избегать неправильных узлов, почему бы просто не обернуть все, что вам нужно заменить внутри <span>, например:

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

Тогда:

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

Ответ 2

Удалите текстовое поле и замените тег <b> тем, что вам нужно, не касаясь входов:

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

FIDDLE

Ответ 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/

Ответ 4

Как насчет:

function changeText() {
    $("#demoTable td").each(function () {
       $(this).html().replace("8: Tap on APN and Enter <B>www</B>", "");
    }
}

Ответ 5

Оберните свое содержимое для удаления в ptag, затем вы можете сделать что-то вроде этого:

$(function(){
  $("td").click(function(){ console.log($("td").find("p"));
    $("td").find("p").remove();    });
});

FIDDLE DEMO: http://jsfiddle.net/y3p2F/

Ответ 6

Немного поздно для вечеринки, но JQuery изменить внутренний текст, но сохранить html имеет как минимум один подход, не упомянутый здесь:

var $td = $("#demoTable td");
$td.html($td.html().replace('Tap on APN and Enter', 'new text'));

Без исправления текста вы можете использовать (snother) [/info/114022/jquery-change-inner-text-but-preserve-html/706885#706885:

var $a = $('#demoTable td');
var inner = '';
$a.children.html().each(function() {
    inner = inner + this.outerHTML;
});
$a.html('New text' + inner);