使用innerhtml属性
在javascript中,我们可以使用innerhtml属性获取html标签下的文本内容。innerhtml属性可以获取标签内所有包含在标签中的文本,包括嵌套标签的文本内容。
例如,假设我们有这样一个html结构:
<div id="container"> <p>这是第一段文本</p> <p>这是第二段文本</p> <p>这是第三段文本</p></div>
我们可以使用以下代码获取所有p标签下的文本内容:
var container = document.getelementbyid("container");var innertext = container.innerhtml;console.log(innertext);
输出结果为:
<p>这是第一段文本</p><p>这是第二段文本</p><p>这是第三段文本</p>
但是需要注意的是,innerhtml属性不仅会获取文本内容,还会获取标签本身的元素,包括标签内的属性和事件,所以使用innerhtml属性来获取文本内容时,需要先将标签内的html元素去除,才能得到我们想要的文本。
使用innertext属性
除了innerhtml属性,我们还可以使用innertext属性来获取html标签下的纯文本内容,它会忽略html标签,并仅返回文本内容部分。这个属性只能获取当前元素内部的文本内容,不包括它的子元素的文本内容。
因此,如果我们想要获取html标签下的多个文本内容,我们需要使用for循环逐一获取子元素的innertext属性。例如:
var container = document.getelementbyid("container");var paragraphs = container.getelementsbytagname("p");var innertext = "";for (var i = 0; i < paragraphs.length; i++) { innertext += paragraphs[i].innertext + "";}console.log(innertext);
输出结果为:
这是第一段文本这是第二段文本这是第三段文本
使用textcontent属性
除了以上两种方法,我们还可以使用textcontent属性获取html标签下的文本内容。与innertext不同的是,textcontent属性会获取标签下所有的文本节点,包括标签内的所有空格和换行符。
同样地,如果我们想要获取html标签下的多个文本内容,我们需要使用for循环逐一获取子元素的textcontent属性。例如:
var container = document.getelementbyid("container");var paragraphs = container.getelementsbytagname("p");var textcontent = "";for (var i = 0; i < paragraphs.length; i++) { textcontent += paragraphs[i].textcontent + "";}console.log(textcontent);
输出结果为:
这是第一段文本这是第二段文本这是第三段文本
综上所述,javascript中提供了多种方法来获取html标签下的文本内容。根据需要选择合适的方法来获取所需要的文本内容即可。
以上就是javascript标签下多个文本怎么取的详细内容。