Javascript 如何获取至少有一个直接子文本节点的元素

我正在尝试编写一个函数，该函数返回具有直接子文本节点的所有元素-

function getAllElementsWithDirectTextNode() {
    var matchingElements = [];
    var allElements = document.body.getElementsByTagName('*');
    for (var i = 0, n = allElements.length; i < n; i++) {
         if (allElements[i].childNodes !== null) {
             matchingElements.push(allElements[i]);
         }
    }
    console.log(allElements);           
}

函数getAllegementSwithDirectTextNode（）{ var matchingElements=[]； var-allegements=document.body.getElementsByTagName（'*'）； 对于（var i=0，n=allegements.length；i 然而，这是行不通的。我认为这与第五行（if语句）有关。如果元素没有直接文本节点子元素，但有一个直接元素子元素有自己的子文本，我不想包含它

编辑：我用下面的DOM尝试了Praveen Kumar的解决方案，控制台将打印主体中的所有元素。但是，我只希望看到div.div1、span.span2、div.div3和button。我做错什么了吗

<div class="div1">
   this is direct text
   <span class="span1"></span>
</div>
<div class="div2">
    <span class="span2">this is span text</span>
</div>
<article></article>
<div class="div3">
    <span class="span3"></span>
    this is direct text, child #2
</div>

这是直接文本
这是span文本
这是直接文本，孩子2

您需要检查他们是否有

节点的
节点类型为
的
子节点

function getAllElementsWithDirectTextNode() {
  var matchingElements = [];
  var allElements = document.body.getElementsByTagName('*');
  for (var i = 0, n = allElements.length; i < n; i++) {
    if (allElements[i].childNodes !== null) {
      for (var j in allElements[i].childNodes)
        if (allElements[i].childNodes[j].nodeType == Node.TEXT_NODE) {
          matchingElements.push(allElements[i]);
          break;
        }
    }
  }
  console.log(allElements);           
}

函数getAllegementSwithDirectTextNode（）{
var matchingElements=[]；
var-allegements=document.body.getElementsByTagName（'*'）；
对于（var i=0，n=allegements.length；i
您需要测试是否有任何子节点是文本节点。所以你需要遍历所有的孩子，测试他们的类型

function getAllElementsWithDirectTextNode() {
  var matchingElements = [];
  var allElements = document.body.getElementsByTagName('*');
  for (var i = 0, n = allElements.length; i < n; i++) {
    if (allElements[i].childNodes !== null) {
      var children = allElements[i].childNodes;
      for (var j = 0, m = children.length; j < m; j++) {
        if (children[j].nodeType == Node.TEXT_NODE) {
          matchingElements.push(allElements[i]);
          break; // don't need to check the remaining children
        }
      }
    }
  }
  console.log(allElements);
}

函数getAllegementSwithDirectTextNode（）{
var matchingElements=[]；
var-allegements=document.body.getElementsByTagName（'*'）；
对于（var i=0，n=allegements.length；i


$（函数（）{
var textNodeIterator=document.createNodeIterator(
文件正文，
NodeFilter.SHOW_TEXT，
功能（节点）{
if（is_ignorable（node））返回NodeFilter.FILTER_REJECT；
返回NodeFilter.FILTER\u接受；
});
var matchingElements=[]；
无功电流节点；
while（currentNode=textNodeIterator.nextNode（））{
//console.log（currentNode）；
如果（当前节点）{
//console.log（currentNode.nodeType+“-”+currentNode.textContent）；
如果（！isParentAlreadyMatched（currentNode.parentNode））匹配Elements.push（currentNode.parentNode）；
}
}
console.log（匹配元素）；
函数为所有（nod）{
//使用ECMA-262第3版字符串和RegExp功能
return！（/[^\t\n\r]/.test（nod.textContent））；
}
功能可忽略（nod）{
return（nod.nodeType==8）| |//注释节点
（（nod.nodeType==3）&&is_all_ws（nod））；//一个文本节点，所有ws
}
函数isParentAlreadyMatched（parentNode）{
对于（var i=0；i

函数getAllegementSwithDirectTextNode（）{
var matchingElements=[]；
var-allegements=document.body.getElementsByTagName（'*'）；
对于（var i=0；i
您正在测试它是否有子节点，而不是测试子节点是否为文本节点。@ajm：现在我明白您在找什么了。在编辑器或作者格式化html时，DOM中每个元素下都可以有空白文本节点。您正在寻找一种忽略这些空白并只考虑相关文本的解决方案。我修改了我的答案，以符合你的实际意图。有一个JSFIDLE添加为well@ajm：如果要查看具有即时文本节点（带空格或不带空格）的所有元素，应从“我的代码”中删除空格筛选。@ajm请将对您有效的解决方案标记为答案。
childNodes
是节点列表，您不能测试它的类型。@Praveen:它是nodeType而不是nodeType。更正错误。@santon该死！我的错误。非常感谢。@Praveen，@ajm这个解决方案行不通。每当一个元素正好有三个子节点时，它就会因为Node.TEXT_Node等于3而不点火。我为“for”循环解决方案添加了第二个JSFIDLEloop@Barmar：将节点更改为节点。不允许我编辑一个字符。有没有一种方法可以使用常规Javascript而不是jQuery；我删除了$和外圆括号，然后给了函数一个名称。@ajm:唯一的JQuery引用是ready函数。删除它以使用window.onload（function（）{}）或像以前一样使用函数名
$(function () {
var textNodeIterator = document.createNodeIterator(
document.body,
NodeFilter.SHOW_TEXT,

function (node) {
    if (is_ignorable(node)) return NodeFilter.FILTER_REJECT;
    return NodeFilter.FILTER_ACCEPT;
});
var matchingElements = [];
var currentNode;

while (currentNode = textNodeIterator.nextNode()) {
    //console.log(currentNode);
    if (currentNode) {
        //console.log(currentNode.nodeType + "-" + currentNode.textContent);
        if (!isParentAlreadyMatched(currentNode.parentNode)) matchingElements.push(currentNode.parentNode);
    }
}
console.log(matchingElements);

function is_all_ws(nod) {
    // Use ECMA-262 Edition 3 String and RegExp features
    return !(/[^\t\n\r ]/.test(nod.textContent));
}

function is_ignorable(nod) {
    return (nod.nodeType == 8) || // A comment node
    ((nod.nodeType == 3) && is_all_ws(nod)); // a text node, all ws
}

function isParentAlreadyMatched(parentNode) {
    for (var i = 0; i < matchingElements.length; i++) {
        if (matchingElements[i] === parentNode) return true;
    }
    return false;
}
});

 function getAllElementsWithDirectTextNode() {
    var matchingElements = [];
    var allElements = document.body.getElementsByTagName('*');
    for (var i = 0; i < allElements.length; i++) {
        for (var j=0; j < allElements[i].childNodes.length; j++) {
            if (allElements[i].childNodes[j].nodeType === Node.TEXT_NODE) {
                if (is_all_ws(allElements[i].childNodes[j])) continue;
                matchingElements.push(allElements[i]);
                break;
            }
        }
    }
    console.log(matchingElements);
}

function is_all_ws(nod) {
   // Use ECMA-262 Edition 3 String and RegExp features
   return !(/[^\t\n\r ]/.test(nod.textContent));
}