方法1：使用HTML DOM textContent属性
HTML DOM textContent属性设置/返回已定义节点及其所有后代的文本内容。通过设置textContent属性，子节点将被删除，并将其替换为具有指定字符串的单个Text节点。
语法：
返回节点的文本内容
node.textContent
设置节点的文本内容
node.textContent = text
属性值：包含单值text，指定指定节点的文本内容。
返回值：返回一个字符串，表示节点及其所有后代的文本。如果元素是文档，文档类型或表示法，则返回null。
示例：使用textContent属性获取内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body style="text-align:center;" id="body">
<h2>HTML DOM textContent属性</h2>
<span id="Span" style="font-size: 15px; font-weight: bold;">这是span元素的文本。</span>
<br><br>
<button onclick="Run()">单击这里 </button>
<p id="DOWN" style="color:red; font-size: 20px; font-weight: bold;">
</p>
<script>
var span = document.getElementById("Span");
var el_down = document.getElementById("DOWN");
function Run() {
el_down.innerHTML = span.textContent;
}
</script>
</body>
</html>输出：
方法2：使用HTML DOM innerText属性
HTML DOM innerText属性设置/返回已定义节点及其所有后代的文本内容。通过设置innerText属性，将删除所有子节点，并将其替换为具有指定字符串的单个Text节点。
语法：
返回节点的文本内容
node.innerText
设置节点的文本内容
node.innerText=text
属性值：包含单值text，指定指定节点的文本内容
返回值：返回一个字符串，表示节点及其所有子节点的“rendered”文本内容。
示例：使用innerText属性获取内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body style="text-align:center;" id="body">
<h2>HTML DOM textContent属性</h2>
<span id="Span" style="font-size: 15px; font-weight: bold;">这是span元素的文本。</span>
<br><br>
<button onclick="Run()">单击这里 </button>
<p id="DOWN" style="color:palevioletred; font-size: 20px; font-weight: bold;">
</p>
<script>
var span = document.getElementById("Span");
var el_down = document.getElementById("DOWN");
function Run() {
el_down.innerHTML = span.innerText;
}
</script>
</body>
</html>输出：
以上就是JavaScript如何获取span元素的文本？的详细内容，更多请关注0133技术站其它相关文章！
