试着这样做：

var articleFirst = document.querySelectorAll("article.first");
console.log(articleFirst)
var oferts = articleFirst[0].querySelectorAll(".oferts");
console.log(oferts)

通过控制台，您可以看到正在发生的事情。
或者这样做：

document.querySelectorAll("article.first .oferts");

querySelectorAll是在DOM中的Element和Document节点上找到的方法。
您正尝试在调用querySelectorAll的返回值上调用它，querySelectorAll返回一个节点列表（类似于对象的数组）。您需要遍历节点列表并依次在其中的每个节点上调用querySelector。
或者，在最初调用它时使用后代组合子。

var oferts = document.querySelectorAll("article.first .oferts");

您需要使用document.querySelector而不是document.querySelectorAll，因为下一个查询依赖于single HTMLElement，但document.querySelectorAll返回NodeList。

document.addEventListener('DOMContentLoaded', TestCtrl);

function TestCtrl() {
  var firstArticle = document.querySelector('article.first');
  
  console.log('oferts', firstArticle.querySelectorAll('.oferts'));
}

<article class="first">     
  <div class="feature parts"> 
    <div class="oferts"> 
      <div class="heart icons"></div> 
      <h1>Build with passion</h1>  
    </div>
  </div> 
</article>

有点冗长，但您可以尝试qselectorAll（'article '），然后将nodeList转换为数组并选择第一个索引......例如：

let articleList = querySelectorAll('article'); // makes a NodeList of all article tags on the webpage

let article = Array.from(articleList);

article[0];