Αναζήτηση στοιχείων μέσα σε ένα άλλο στοιχείο στο JavaScript

Ας υποθέσουμε ότι έχουμε ένα γονικό στοιχείο, και μέσα του άλλα στοιχεία:

<div id="parent">
	<div class="child">text</div>
	<div class="child">text</div>
	<div class="child">text</div>
</div>

Ας υποθέσουμε ότι ο σύνδεσμος προς τον γονέα έχει ήδη ληφθεί σε μια μεταβλητή:

let parent = document.querySelector('#parent');

Σε αυτήν την περίπτωση, εάν χρειαστεί, μπορούμε να εκτελέσουμε αναζήτηση με βάση έναν επιλογέα μέσα σε αυτόν τον γονέα, και όχι σε ολόκληρο το έγγραφο. Για να το κάνετε αυτό η μέθοδος αναζήτησης πρέπει να εφαρμοστεί όχι στο document, αλλά στη μεταβλητή που περιέχει τον γονέα μας.

Για παράδειγμα, ας βρούμε μέσα στον γονέα μας στοιχεία με την κλάση child:

let elems = parent.querySelectorAll('.child');

Δίνεται το στοιχείο #parent:

<div id="parent">
	<p class="www">text</p>
	<p class="www">text</p>
	<p class="www">text</p>
	<p class="ggg">text</p>
	<p class="ggg">text</p>
	<p class="ggg">text</p>
</div>

let parent = document.querySelector('#parent');

Βρείτε μέσα στον γονέα στοιχεία με την κλάση www και γράψτε τα στη μεταβλητή elems1. Στη συνέχεια, βρείτε μέσα στον γονέα στοιχεία με την κλάση ggg και γράψτε τα στη μεταβλητή elems2.