JavaScript获取不包括子项的文本内容

Question

首先，我正在为JavaScript创建一个库，但我不能使用jQuery。我试图获取一个HTML元素的文本内容，而不包含其子元素的文本内容。

innerText和textContent属性都没有提供所需的内容，请帮助。

Answer 1

var mydiv = getElementByID("id");
function Get_text(element) {
    var selected = element.cloneNode(true);
    var text;
    while (selected.firstChild) {
      if (selected.firstChild.nodeType == 3) text = selected.firstChild.nodeValue;
      selected.removeChild(selected.firstChild);
    }
    return text;
  }
Get_text(mydiv);

Answer 2

从以下元素（不包括

<div class="details__instructor">
    Author's Name<span ng-show="job_title">, Entrepreneur</span>
</div>

使用childNodes[0]。例如：

document.querySelector('div.details__instructor').childNodes[0]

结果是一个对象：

"Author's Name"

更新：答案被否决，没有任何评论。在生产中使用之前，确定该方法的有效性。

Answer 3

您可以使用DOMAPI作为子节点和节点类型来解决这个问题。

var elChildNode = document.querySelector("#hello").childNodes;
var sChildTextSum = "";

elChildNode.forEach(function(value){
    if(value.nodeType === Node.TEXT_NODE) { 
        console.log("Current textNode value is : ", value.nodeValue.trim());
        sChildTextSum += value.nodeValue;
    }
}); 

console.log("All text value of firstChild : ", sChildTextSum);

我创建了一个示例代码，如上所述。

https://jsfiddle.net/nigayo/p7t9bdc3/