如何在 JS 中的文本节点 (document.createTextNode('...')) 中添加 span 元素？

Question

我知道 JS 中的 document.createTextNode(text) 只是用来创建文本的，但是有没有办法在其中插入两个 span 元素？

我有两个像这样创建的跨度：

/*
   *   span with wrong (old) medical word
   */

  // Replacement node
  var span_old = $('<span />', {
    'class': pluginName + '-autoword-highlight wrong wrong-medical-word-'+i
  });

  // If we have a new match
  if (i !== c) {
    c = i;
    replaceElement = span_old;
  }

  span_old
  .text(fill)
  .data({
    'firstElement': replaceElement,
    'word': oldWord
  });




  /*
   *  span with new - corrected medical word
   * 
   */
  // Replacement node
  var span_new = $('<span />', {
    'class': pluginName + '-autoword-highlight corrected-medical-word-'+i
  });

  // If we have a new match
  if (i !== c) {
    c = i;
    replaceElement = span_new;
  }

  span_new
  .text(replaceFill)
  .data({
    'firstElement': replaceElement,
    'word': replaceFill
  });

  var wrong_and_corrected_medical_text = span_old[0] + span_new[0];

  return document.createTextNode(wrong_and_corrected_medical_text);

预期结果是

旧文本 - 新文本

我需要一如既往地 return 文本节点。是否有将 span 元素或其他方式字符串化的技巧？谢谢！

Answer 1

这是你需要的吗？

var wrong_and_corrected_medical_text = span_old.text() + span_new[0].text();

编辑： 所以你需要 html 作为文本返回，请试试这个。

var wrong_and_corrected_medical_text = span_old.prop('outerHTML') + span_new.prop('outerHTML');

参考： https://developer.mozilla.org/en-US/docs/Web/API/Element/outerHTML

如何在 JS 中的文本节点 (document.createTextNode('...')) 中添加 span 元素？

How to add span elements within text node (document.createTextNode('...')) in JS?

javascript

string

dom

textnode