Elementオブジェクトから子要素を取り出すには


javascriptで下記のDOM要素?を取得したのですが、子要素の`.dlcard > dlcard__thumbnail >
img`のようにアクセスしたいです。どのような関数を使用したらよいでしょうか？ 要素はinputという変数に格納されています。

[![画像の説明をここに入力](https://i.stack.imgur.com/PF3s4.png)](https://i.stack.imgur.com/PF3s4.png)

**追記**  
説明不足ですいません。  
inputに格納されたelementオブジェクトから要素を取り出す方法はないでしょうか？  
querySelectorだと全体のhtmlからとういう事になります。




Document.querySelector()を使えばいいでしょう。

[Document.querySelector() - Web API |
MDN](https://developer.mozilla.org/ja/docs/Web/API/Document/querySelector)

[code]

    var el = document.querySelector(".dlcard > .dlcard__thumbnail > img");
    
[/code]

* * *

追記

> inputに格納されたelementオブジェクトから要素を取り出す

[Element.querySelector() - Web API |
MDN](https://developer.mozilla.org/ja/docs/Web/API/Element/querySelector)

[code]

    var input = document.querySelector(".input");
    var img = input.querySelector(".dlcard > .dlcard__thumbnail > img");
    console.log(img);
    
[/code]




Document.querySelector()を使えばいいでしょう。

[Document.querySelector() - Web API |
MDN](https://developer.mozilla.org/ja/docs/Web/API/Document/querySelector)

[code]

    var el = document.querySelector(".dlcard > .dlcard__thumbnail > img");
    
[/code]

* * *

追記

> inputに格納されたelementオブジェクトから要素を取り出す

[Element.querySelector() - Web API |
MDN](https://developer.mozilla.org/ja/docs/Web/API/Element/querySelector)

[code]

    var input = document.querySelector(".input");
    var img = input.querySelector(".dlcard > .dlcard__thumbnail > img");
    console.log(img);
    
[/code]

