从 getElementsByClassName 中排除 child class

Question

一个网页有这样的结构，我想要"post-entry"这个class的所有文字内容，除了下面一个childclass。我已将不需要的文本标记为 "EXCLUDE THIS":

<div class="post-entry">
    <p><em></em></p>
    <p><em>INCLUDE THIS</em></p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p><em></em></p>
    <blockquote></blockquote>
    <h4></h4>
    <p><em></em></p>
    <p>&nbsp;</p>

    <span class="scroll-top">
        <a href="#scroll-top" title="Go to top"><span class="dashicons dashicons-arrow-up-alt2 top"></span>EXCLUDE THIS</a>
    </span>
</div>

我一直在使用以下代码来获取我想要的数据，它工作正常，除了它包含我在上一个示例中标记为 "EXCLUDE THIS" 的部分。

var contentElem = document.getElementById('content');
var titleText = contentElem.getElementsByClassName('entry-title');
var entryText = contentElem.getElementsByClassName('post-entry');

var textToLog = titleText[0].innerText + "\n\n" + entryText[0].innerText; 
console.log(textToLog);

我搜索过的一些解决方案 return“无法读取属性 'innerText' of undefined” 实施时或类似的。要么我无法获得正确的语法，要么经过测试的解决方案不适合该任务。我很确定 javascript 没有 jQuery.

中有一个语法

那么如何排除那个 child class？

提前致谢。

Answer 1

您需要定位标识符（元素 class/tag/id）并明确排除它。在您上面的代码中，标识符将是 scroll-top class

// post-entry element
var postEntry = document.getElementsByClassName('post-entry')[0];

// get 1st level (direct) children under post-entry div
var postEntryChildren = postEntry.childNodes;

var content = '';
for(var i =0;i<postEntryChildren.length;i++){
  // check if the textContent is not empty and the className is not 'scroll-top' which includes the text to be excluded
  if(postEntryChildren[i].textContent && postEntryChildren[i].textContent.trim() && postEntryChildren[i].className !== 'scroll-top'){
    if(content) content += '\n';
    content += postEntryChildren[i].textContent
  }
}

console.log(content);

<div class="post-entry">
    <p><em></em></p>
    <p><em>INCLUDE THIS</em></p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p>INCLUDE THIS</p>
    <p><em></em></p>
    <blockquote></blockquote>
    <h4></h4>
    <p><em></em></p>
    <p>&nbsp;</p>

    <span class="scroll-top">
        <a href="#scroll-top" title="Go to top"><span class="dashicons dashicons-arrow-up-alt2 top"></span>EXCLUDE THIS</a>
    </span>
</div>

从 getElementsByClassName 中排除 child class

Excluding child class from getElementsByClassName

html

javascript

getelementsbyclassname