极客教程JavaScript 如何不使用其子代的innerText获得H1的innerText
获取一个HTML元素的内部文本是开发网络应用程序时的一项常见任务。在JavaScript中，可以使用HTMLElement对象的innerText属性来完成。然而，这只能返回该特定元素的文本，而不是其任何子元素。
如果你需要只获得H1标签的内部文本而不包括其子元素的内部文本，那么有几种方法可以做到。本文将讨论一些在不包括其子元素的innerText的情况下在JavaScript中获取H1标签innerText的方法。
一个节点及其子元素的渲染文本内容由HTMLElement接口的innerText属性表示。作为一个获取器，它模拟了文本；如果用户使用光标来突出元素的内容，然后将它们复制到剪贴板上，就会获得这些文本。
语法
以下是JavaScript中innertext的语法。
element.innerText
让我们来看看下面的例子，以了解更多关于如何在JavaScript中获得h1的innerText而不包括其子的innerText。
示例
在下面的例子中，我们正在运行脚本来获取JavaScript中的innerText。
<!DOCTYPE html>
<html>
<body>
<div class="Bike">
<div class="Car">
<label for="name"><b>Actual Text:</b></label>
<h1> This is BMW<span> That Was Ducati </span></h1>
</div>
</div>
<h3>Innertext:</h3>
<script>
const h1 = document.querySelector('div.Car h1');
const text = h1.childNodes[0].textContent;
document.write(text);
</script>
</body>
</html>
示例
考虑到下面的例子，我们正在运行脚本以获得h1的innerText，同时添加一些额外的信息。
<!DOCTYPE html>
<html>
<body>
<div class="tutorial">
<div class="tutorial1">
<label for="actual"><b>Actual Text:</b></label><br>
<h1>Welcome <span>to the Tutorialpoint</span> HELLO </h1>
</div>
</div>
<h1>Innertext:</h1>
<script>
const h1 = document.querySelector('div.tutorial h1');
const el = h1.childNodes;
let result = "";
for(i=0;i<el.length;i++){
if(el[i].nodeName == '#text'){
result+=el[i].textContent;
}
}
document.write(result);
</script>
</body>
</html>
示例
让我们来看看另一个在JavaScript中获得innerText的例子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<body>
<div class="first-header">
<div class="second-header">
<h1> This is h1 tag........<span>This is span tag inside h1 tag.......... </span></h1>
</div>
</div>
</body>
<script>
var valueOfh1 = document.querySelector('div.second-header h1');
var value = valueOfh1.childNodes[0].textContent;
document.write(value);
</script>
</html>