Найдите самый внутренний текст с помощью javascript (jquery) независимо от количества вложенных элементов и замените его

Question

Если у меня есть это:

<a href="#" id="the-link"><em>any random text</em></a>

Или это:

<a href="#" id="the-link">any random text</a>

Или это:

<a href="#" id="the-link"><em><div id="foo"><span>any random text</span></div></em></a>

Я хотел бы захватить текст «любой случайный текст» и затем заменить его.

Как я могу сделать это с помощью jQuery? Если не с jQuery, просто обычный javascript?

Answer 1

Вы можете сделать это рекурсивно.Все довольно просто:

function replaceTextNodes(node, newText) {
    if (node.nodeType == 3) {
        // Filter out text nodes that contain only whitespace
        if (!/^\s*$/.test(node.data)) {
            node.data = newText;
        }
    } else if (node.hasChildNodes()) {
        for (var i = 0, len = node.childNodes.length; i < len; ++i) {
            replaceTextNodes(node.childNodes[i], newText);
        }
    }
}

replaceTextNodes(document.getElementById("the-link"), "NEW TEXT");

Answer 2

$('a:contains(starcraft)').html('starcraft 2');

Редактировать для комментария: jsfiddle

$('a').find(':only-child:last').html('starcraft 2');

Answer 3

var link = $('#the-link');
var inner = link;
while(inner.children().length > 0)
     inner = inner.children();

inner.html('whatever');

Answer 4

Возможно, вы захотите проверить этот вопрос: выберите самого глубокого ребенка в jQuery

Похоже, вам нужно найти самого глубокого ребенка, а затем вызвать .html('new string') или .text('new string').