通过javascript获取没有HTML元素的纯文本？
我有我的HTML 1button和一些文本如下所示：
function get_content(){ // I don't know how to do in here!!! } <input type="button" onclick="get_content()" value="Get Content"/> <p id='txt'> <span class="A">I am</span> <span class="B">working in </span> <span class="C">ABC company.</span> </p> 当用户点击button时， <p id='txt'>将成为后续内容
预期结果：
<p id='txt'> // All the HTML element within the <p> will be disappear I am working in ABC company. </p>
任何人都可以帮助我如何编写JavaScript的function？ 谢谢。
[2017-07-25]因为这仍然是被接受的答案，尽pipe是一个非常冒险的解决scheme，我将Gabi的代码join其中，让我自己作为一个坏榜样。
<style> .A {background: blue;} .B {font-style: italic;} .C {font-weight: bold;} </style> <script> // my hacky approach: function get_content() { var html = document.getElementById("txt").innerHTML; document.getElementById("txt").innerHTML = html.replace(/<[^>]*>/g, ""); } // Gabi's elegant approach, but eliminating one unnecessary line of code: function gabi_content() { var element = document.getElementById('txt'); element.innerHTML = element.innerText || element.textContent; } // and exploiting the fact that IDs pollute the window namespace: function txt_content() { txt.innerHTML = txt.innerText || txt.textContent; } </script> <input type="button" onclick="get_content()" value="Get Content (bad)"/> <input type="button" onclick="gabi_content()" value="Get Content (good)"/> <input type="button" onclick="txt_content()" value="Get Content (shortest)"/> <p id='txt'> <span class="A">I am</span> <span class="B">working in </span> <span class="C">ABC company.</span> </p>
你可以使用这个：
var element = document.getElementById('txt'); var text = element.innerText || element.textContent; element.innerHTML = text;
根据您的需要，您可以使用element.innerText或element.textContent 。 它们在很多方面有所不同。 innerText试图逼近如果你select你所看到的（呈现html）并将其复制到剪贴板将会发生什么，而textContentsorting只是剥离html标签，并给你剩下的东西。
innerText也与旧的IE浏览器兼容（来自那里）。
如果你可以使用jQuery，那么它很简单
$("#txt").text()
这个答案将工作得到任何HTML元素的文本。
这第一个参数“节点”是从中获取文本的元素。 第二个参数是可选的，如果true将在元素之间的文本之间添加一个空格，否则没有空格。
function getTextFromNode(node, addSpaces) { var i, result, text, child; result = ''; for (i = 0; i < node.childNodes.length; i++) { child = node.childNodes[i]; text = null; if (child.nodeType === 1) { text = getTextFromNode(child, addSpaces); } else if (child.nodeType === 3) { text = child.nodeValue; } if (text) { if (addSpaces && /\S$/.test(result) && /^\S/.test(text)) text = ' ' + text; result += text; } } return result; }
根据您的需要，您可以使用element.innerText或element.textContent 。 它们在很多方面有所不同。 innerText试图逼近如果你select你所看到的（呈现html）并将其复制到剪贴板将会发生什么，而textContentsorting只是剥离html标签，并给你剩下的东西。
innerText 不仅仅用于IE ，而且在所有主stream浏览器中都支持 。 当然，与textContent不同，它与旧的IE浏览器兼容（因为他们提出了它）。
完整的例子（来自Gabi的回答 ）：
var element = document.getElementById('txt'); var text = element.innerText || element.textContent; // or element.textContent || element.innerText element.innerHTML = text;
这应该工作：
function get_content(){ var p = document.getElementById("txt"); var spans = p.getElementsByTagName("span"); var text = ''; for (var i = 0; i < spans.length; i++){ text += spans[i].innerHTML; } p.innerHTML = text; }
试试这个小提琴： http : //jsfiddle.net/7gnyc/2/
function get_content(){ var returnInnerHTML = document.getElementById('A').innerHTML + document.getElementById('B').innerHTML + document.getElementById('A').innerHTML; document.getElementById('txt').innerHTML = returnInnerHTML; }
这应该做到这一点。
