非常简单的querySelector就可以了

null

// first h1 in header

console.log(
  document.querySelector("header > h1").textContent
)

// first h1 in document:

console.log(
  document.querySelector("h1").textContent
)

header > h1 {
  color: green
}

<header>
  <h1>I want to select this</h1>
  <div>
    <h1>Welcome to the world!</h1>
    <p>I don't like apples</p>
  </div>
</header>

使用此

h1:first-of-type{

}

祝你好运。

您可以使用此选项，选择父级，然后选择h1类型的第一个子级

null

   header > h1:first-child{
       color:red;
   }