Javascript n′； } } } } 返回结果； }

主要的变化是

      if (i < j-1) {
        if (isNodeBlock(node.childNodes[i])) {
          result += '\n';
        } else if (isNodeBlock(node.childNodes[i+1]) &&
                   node.childNodes[i+1].tagName != 'BR' &&
                   node.childNodes[i+1].tagName != 'HR') {
          result += '\n';
        }
      }

if（i

---

要检查相邻块以确定添加换行符的适当性。

我建议对svidgen的代码进行一些编辑：

函数getText（n，isInnerNode）{ var-rv=''； if（n.nodeType==3）{ rv=n.nodeValue； }否则{ var部分=”； var d=getComputedStyle（n）.getPropertyValue（'display'）； 如果（isInnerNode&&d.match（/^block/）| | d.match（/list/）| | n.tagName=='BR'）{ 部分+=“\n”； } 对于（var i=0；i};使用

元素。innerText

这不会返回从contenteditable元素添加的额外节点。 如果使用

element.innerHTML

，文本将包含其他标记，但innerText将返回您在元素内容上看到的内容

<div id="txt" contenteditable="true"></div>

<script>
  var txt=document.getElementById("txt");
  var withMarkup=txt.innerHTML;
  var textOnly=txt.innerText;
  console.log(withMarkup);
  console.log(textOnly);
</script>

var txt=document.getElementById（“txt”）；
var withMarkup=txt.innerHTML；
var textOnly=txt.innerText；
console.log（带标记）；
console.log（仅限文本）；

这听起来是个有趣的问题。我希望有一种方法可以迭代元素和节点，在任何地方插入新行，无论它进入或离开具有块计算样式的元素（但如果没有插入文本节点，则不会加倍）或导致新行的元素（可能是BR、HR、TR）。处理表是另一个问题。我得到了一些有用的东西，但它依赖于HTML格式：。如果确实希望基于块级事件获取缩进文本，则必须检查每个元素，并根据元素是否为块级做出决定（也可能对不同的块级元素进行不同的处理）。如您所见，我发布了一个答案，但删除了它，因为我不确定这是否是您想要的方向。

getStyle

始终返回

”

，因此我假设这意味着“

节点

”必须在DOM中处于活动状态才能工作？更改为支持

TEXT1TEXT2

=>

TEXT1\nTEXT2

小提琴使用答案中所示代码的简化版本。我最终使用了fiddle版本，通过运行

.replace（/\n{3，}/g，'\n\n'）

删除了多余的换行符。创建这个fork（）使用

包装的块，而不是

\n

，这更适合插入DOM。 Header Paragraph First Second Term Definition Div with span. After the break.

function getText($node) {
    return $node.contents().map(function () {
        if (this.nodeName === 'BR') {
            return '\n';
        } else if (this.nodeType === 3) {
            return this.nodeValue;
        } else {
            return getText($(this));
        }
    }).get().join('');
}

/**
 * Returns the style for a node.
 *
 * @param n The node to check.
 * @param p The property to retrieve (usually 'display').
 * @link http://www.quirksmode.org/dom/getstyles.html
 */
this.getStyle = function( n, p ) {
  return n.currentStyle ?
    n.currentStyle[p] :
    document.defaultView.getComputedStyle(n, null).getPropertyValue(p);
}

/**
 * Converts HTML to text, preserving semantic newlines for block-level
 * elements.
 *
 * @param node - The HTML node to perform text extraction.
 */
this.toText = function( node ) {
  var result = '';

  if( node.nodeType == document.TEXT_NODE ) {
    // Replace repeated spaces, newlines, and tabs with a single space.
    result = node.nodeValue.replace( /\s+/g, ' ' );
  }
  else {
    for( var i = 0, j = node.childNodes.length; i < j; i++ ) {
      result += _this.toText( node.childNodes[i] );
    }

    var d = _this.getStyle( node, 'display' );

    if( d.match( /^block/ ) || d.match( /list/ ) || d.match( /row/ ) ||
        node.tagName == 'BR' || node.tagName == 'HR' ) {
      result += '\n';
    }
  }

  return result;
}

/**
 * Returns the style for a node.
 *
 * @param n The node to check.
 * @param p The property to retrieve (usually 'display').
 * @link http://www.quirksmode.org/dom/getstyles.html
 */
function getNodeStyle( n, p ) {
  return n.currentStyle ?
    n.currentStyle[p] :
    document.defaultView.getComputedStyle(n, null).getPropertyValue(p);
}

//IF THE NODE IS NOT ACTUALLY IN THE DOM then this won't take into account <div style="display: inline;">text</div>
//however for simple things like `contenteditable` this is sufficient, however for arbitrary html this will not work
function isNodeBlock(node) {
  if (node.nodeType == document.TEXT_NODE) {return false;}
  var d = getNodeStyle( node, 'display' );//this is irrelevant if the node isn't currently in the current DOM.
  if (d.match( /^block/ ) || d.match( /list/ ) || d.match( /row/ ) ||
      node.tagName == 'BR' || node.tagName == 'HR' ||
      node.tagName == 'DIV' // div,p,... add as needed to support non-DOM nodes
     ) {
    return true;
  }
  return false;
}

/**
 * Converts HTML to text, preserving semantic newlines for block-level
 * elements.
 *
 * @param node - The HTML node to perform text extraction.
 */
function htmlToText( htmlOrNode, isNode ) {
  var node = htmlOrNode;
  if (!isNode) {node = jQuery("<span>"+htmlOrNode+"</span>")[0];}
  //TODO: inject "unsafe" HTML into current DOM while guaranteeing that it won't
  //      change the visible DOM so that `isNodeBlock` will work reliably
  var result = '';
  if( node.nodeType == document.TEXT_NODE ) {
    // Replace repeated spaces, newlines, and tabs with a single space.
    result = node.nodeValue.replace( /\s+/g, ' ' );
  } else {
    for( var i = 0, j = node.childNodes.length; i < j; i++ ) {
      result += htmlToText( node.childNodes[i], true );
      if (i < j-1) {
        if (isNodeBlock(node.childNodes[i])) {
          result += '\n';
        } else if (isNodeBlock(node.childNodes[i+1]) &&
                   node.childNodes[i+1].tagName != 'BR' &&
                   node.childNodes[i+1].tagName != 'HR') {
          result += '\n';
        }
      }
    }
  }
  return result;
}

      if (i < j-1) {
        if (isNodeBlock(node.childNodes[i])) {
          result += '\n';
        } else if (isNodeBlock(node.childNodes[i+1]) &&
                   node.childNodes[i+1].tagName != 'BR' &&
                   node.childNodes[i+1].tagName != 'HR') {
          result += '\n';
        }
      }

<div id="txt" contenteditable="true"></div>

<script>
  var txt=document.getElementById("txt");
  var withMarkup=txt.innerHTML;
  var textOnly=txt.innerText;
  console.log(withMarkup);
  console.log(textOnly);
</script>