XMLで、一番親の直下のタグを取得したい

Question

<Hoge>
　<Fuga>
　　<Piyo>
　　</Piyo>
　</Fuga>
</Hoge>

上記のようなXMLが変数targetに入っていたとして、
target.querySelector() を使ってHogeの直下にあるFugaを取得したいです。但し、
target.querySelector('Fuga')のようにセレクタをタグ名で指定せず、【<Hoge>の直下にあるもの】という取得をしたい(Fugaが他の名前に変わっても取得できるようにしたいため)のですが、どのような書き方をすれば解決できますでしょうか。

Answer 1

XMLが変数targetに入っていたとして、

変数 target に XML文書（テキストデータ:text/xml,application/xml）が格納されている場合は、DOMParser を使うと、馴染みのあるDOM操作ができます（querySelectorなど）。

target.querySelector() を使ってHogeの直下にあるFugaを取得したいです。

但し、セレクタをタグ名で指定せず、【<Hoge>の直下にあるもの】という取得をしたい

子結合コンビネータ と全称セレクタ を活用し、Hoge>* と記述できます。

var target = `<Hoge>
　<Fuga>
　　<Piyo>
　　</Piyo>
　</Fuga>
</Hoge>`;

var parser = new DOMParser();
var xmlDoc = parser.parseFromString(target, "application/xml");

var myChildNodes = xmlDoc.querySelectorAll("Hoge>*");
console.log( myChildNodes ); // NodeList

Answer 2

childrenでいけると思います。

const hoge = target.querySelector('Hoge');
const children = hoge.children;