javascript 如何从 html 页面获取标签文本值？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17943035/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get label text value form a html page?
提问by The Dark Knight
I have a html page , where the html is rendered as :
我有一个 html 页面，其中 html 呈现为：
<div id = 'mViB'>
<table id = 'myTable'>
<tbody>
<tr> ...</tr>
<tr>...</tr>
<tr> ...</tr>
<tr>....</tr>
<tr>
<td>
<label id="*spaM4" for="*zigField4">
All hell.
<span class = 'msde32'></span>
</label>
</td>
</tr>
</tbody>
</table>
</div>
Now what i want to do is get the label text 'All hell.' from the label.
现在我想要做的是获取标签文本“All hell”。从标签。
For that purpose i have used both : document.getElementById('*spaM4').textand document.getElementById('*spaM4').valuebut incidentally none of them worked.
为此目的，我都用了：document.getElementById('*spaM4').text和document.getElementById('*spaM4').value而顺带没有一次成功。
I have used document.getElementById('*spaM4').innerHTMLbut that returns the span classas well, but i just want to get the text .
我已经使用过，document.getElementById('*spaM4').innerHTML但这也返回了span class，但我只想获取文本。
Unfortunately, the asterisks in element IDs are 3rd party code and I cannot change it.
不幸的是，元素 ID 中的星号是第 3 方代码，我无法更改它。
Can any one suggest any other way for getting the label text ?
任何人都可以建议任何其他方式来获取标签文本吗？
回答by Niklas
Try this:
试试这个：
document.getElementById('*spaM4').textContent
If you need to target < IE9 then you need to use .innerText
如果您需要针对 < IE9，则需要使用 .innerText
回答by Sergio
回答by Cherniv
Use innerText/textContent:
使用innerText/ textContent:
var el = document.getElementById('*spaM4');
console.log(el.innerText || el.textContent);
Fiddle: http://jsfiddle.net/NeTgC/2/
回答by BlackMagic
The best way to get the text value from a <label>element is as follows.
从<label>元素中获取文本值的最佳方法如下。
if you will be getting element ids frequently it's best to have a function to return the ids:
如果您要经常获取元素 id，最好有一个函数来返回 id：
function id(e){return document.getElementById(e)}
Assume the following structure:<label for='phone'>Phone number</label>
<input type='text' id='phone' placeholder='Mobile or landline numbers...'>
假设以下结构：<label for='phone'>Phone number</label>
<input type='text' id='phone' placeholder='Mobile or landline numbers...'>
This code will extract the text value 'Phone number' from the<label>:
var text = id('phone').previousElementSibling.innerHTML;
此代码将从中提取文本值“电话号码”<label>:
var text = id('phone').previousElementSibling.innerHTML;
This code works on all browsers, and you don't have to give each<label>element a unique id.
此代码适用于所有浏览器，您不必为每个<label>元素指定唯一 ID。
回答by Codemaker
You can use textContent attribute to retrieve data from a label.
您可以使用 textContent 属性从标签中检索数据。
<script>
var datas = document.getElementById("excel-data-div").textContent;
</script>
<label id="excel-data-div" style="display: none;">
Sample text
</label>
回答by Sergey
For cases where the data element is inside the labellike in this example:
对于数据元素位于标签内的情况，如本例所示：
<label for="subscription">Subscription period
<select id='subscription' name='subscription'>
<option></option>
<option>1 year</option>
<option>2 years</option>
<option>3 years</option>
</select>
</label>
all the previous answers will give an unexpected result:
之前的所有答案都会给出一个意想不到的结果：
"Subscription period
1 year
2 years
3 years
"
While the expected resultwould be:
虽然预期的结果是：
"Subscription period"
So, the correct solutionwill be like this:
所以，正确的解决方案是这样的：
const label = document.getElementById('yourLableId');
const labelText = Array.prototype.filter
.call(label.childNodes, x => x.nodeName === "#text")
.map(x => x.textContent)
.join(" ")
.trim();
回答by Paddyd
var lbltext = document.getElementById('*spaM4').innerHTML
