Замените textNode текстом HTML в Javascript?

Я был направлен в проект Linkify на GitHub (https://github.com/cowboy/javascript-linkify) для поиска и «связывания» URL-адресов и доменов, только плавающих в тексте.Замените textNode текстом HTML в Javascript?

Это потрясающе! Он полностью работает над текстом!

Однако я не совсем уверен, как заставить его работать с текстовымNode, который имеет текст, который я хочу связать.

Я понимаю, что textNode имеет только textContent с .. это весь текст. Так как эта функция Linkify возвращает HTML как текст, есть ли способ взять textNode и «переписать» HTML внутри него с выходом Linkify?

Я играл с ним на JSFiddle здесь: http://jsfiddle.net/AMhRK/9/

function repl(node) { 

var nodes=node.childNodes; 
for (var i=0, m=nodes.length; i<m; i++) 
{ 
    var n=nodes[i]; 
    if (n.nodeType==n.TEXT_NODE) 
    { 
     // do some swappy text to html here? 
     n.textContent = linkify(n.textContent); 
    } 
    else 
    { 
     repl(n); 
    } 
} 
}

источник

2013-03-21 Jippers

Ваш примерный код настолько грязный и так много, что я даже не знаю с чего начать! Можете ли вы немного почистить его и просто иметь нормальный пример и тот, который вы хотите с помощью textNode? –

http://jsfiddle.net/AMhRK/4/ – Ryan

@ryan это близко, но вы видите, что он управляет уже правильно гиперссылками. – Jippers

Вам нужно заменить TextNode с HTML-элементом, как промежуток, а затем установите linkified-текст как элемент innerHTML.

var replacementNode = document.createElement('span'); 
replacementNode.innerHTML = linkify(n.textContent); 
n.parentNode.insertBefore(replacementNode, n); 
n.parentNode.removeChild(n);

источник

2013-03-21 17:11:01

Это не так просто, поскольку текстовый узел может содержать много «неподключенных» элементов. –

Это похоже на работу! Вот вилка Fiddle с добавлением Уилла Скотта: http://jsfiddle.net/H2aHH/ – Jippers

это поддерживает пользовательский 'Selection', где' .replaceChild() 'does not !! brilliant – neaumusic

В дополнение к предыдущему ответу я предлагаю более короткий путь (на основе JQuery):

$(n).replaceWith('Some text with <b>html</b> support');

где n - это TextNode.

источник

2017-02-02 17:11:35 IStranger

'replaceWith()' доступен как [ванильный JavaScript] (https://developer.mozilla.org/en-US/docs/Web/API/ChildNode/replaceWith) в современных браузерах (Chrome и Firefox; Edge находится под развитие). –

Замените textNode текстом HTML в Javascript?

ответ

Смежные вопросы