const NEWLINE = '\n'; function isBlockElement(node) { return (node.nodeType === Node.ELEMENT_NODE && getComputedStyle(node).display === 'block'); } const walkers = new WeakMap(); function getOrCreateWalker(node) { let walker = walkers.get(node); if (!walker) { walker = document.createTreeWalker(node, NodeFilter.SHOW_TEXT | NodeFilter.SHOW_ELEMENT); walkers.set(node, walker); } walker.currentNode = node; return walker; } function getContent1(rootNode) { let content = ""; const walker = getOrCreateWalker(rootNode); const seen = new Set([rootNode]); for (let currentNode = walker.firstChild(); currentNode !== null;) { while (!seen.has(currentNode) && walker.firstChild() !== null) { seen.add(currentNode); currentNode = walker.currentNode; if (content && !content.endsWith(NEWLINE) && isBlockElement(currentNode)) { content += NEWLINE; } } if (currentNode.nodeType === Node.TEXT_NODE) { const data = currentNode.data; content += data; } else { if (currentNode.tagName === "BR") { content += NEWLINE; } } if (walker.nextSibling() === null) { if (!content.endsWith(NEWLINE) && isBlockElement(currentNode)) { content += NEWLINE; } currentNode = walker.parentNode(); } else { currentNode = walker.currentNode; } } return content; } function getContent2(node) { switch (node.nodeType) { case Node.TEXT_NODE: return node.data; case Node.ELEMENT_NODE: { if (node.nodeName === 'BR') { return NEWLINE; } let result = ''; for (let child = node.firstChild; child !== null; child = child.nextSibling) { if (result && !result.endsWith(NEWLINE) && isBlockElement(child)) { result += NEWLINE; } const content = getContent2(child); result += content; } if (!result.endsWith(NEWLINE) && isBlockElement(node)) { result += NEWLINE; } return result; } default: return ''; } } var div = document.createElement("div"); div.innerHTML = "<div><span>Hello</span><br></div><br><br><div><br><span>W</span>o<span>r</span>l<span>d</span></div>";