Javascript-zoekelement

| | |

De jQuery find () methode klinkt misschien bekend, maar verwar het niet met de JavaScript find () methode! Beide "vinden" dingen, maar wat ze rendement kan heel verschillend zijn. In JavaScript kan de methode find () alleen worden aangeroepen in een array.

Vereist een callback-functie, een functie die als argument aan een methode wordt doorgegeven. om later te bellen. Vindt en retourneert het eerste item dat voldoet aan de vereisten die zijn beschreven in de callback-functie.

De jQuery find ()-methode is heel anders. Zoals alle jQuery-methoden wordt het op een selector aangeroepen. Zoek in deze selector en manipuleer alleen de onderliggende elementen van deze selector. Dit hoge niveau van manipulatie is handig als u sommige elementen wilt wijzigen en niet andere die in hetzelfde bovenliggende element zijn opgenomen.

JQuery find () gebruiken

We kennen nu jQuery find () wordt gebruikt om alle onderliggende elementen van een bepaalde selector te selecteren. Bekijk enkele codevoorbeelden om te zien hoe u jQuery find () gebruikt.

Laten we eenvoudig beginnen en wat complexiteit toevoegen in de volgende secties. We kunnen een element manipuleren nadat de pagina is geladen om te laten zien hoe find () werkt. Hoe zit het met het veranderen van de kleur van sommige woorden in de context van een alinea nadat de pagina is geladen? We beginnen hier:

Elk ander woord blijft hetzelfde.

Kijk naar deze code en je zult binnen de

een paar elementen. Een van de elementen is een kind van het

element . De andere is een kind van de

< class face = "wp-image-block"> IR3bnpJdRzIwsq 1CzCQeT4Lf2F4YaVtdHjwqHecFlqkjNYR Oi9DIefQs IX6Kf1Bh0JQQNYqxQG7okIP98RPQ PYHTDhu AOabwfhnwB4rdWRmoMw5WgSDtLIKD5ZU9b4 is HTML <HTDML> We veranderen nu de kleuren van de tekst om <code>find ()</code> in actie te illustreren. Dit is een geweldige stap voor beginners omdat we maar één CSS-kenmerk hoeven te wijzigen om dit te bereiken. Het element <p>als selector doorgeven aan <code>find ()</code>, we kunnen jQuery`s <code>css ()</code> methode gebruiken om de kleurveranderingen aan te brengen:</p> <p>Als we <code>find () </code> voor het eerst gebruiken, selecteren we alle elementen <p>. We gebruiken <code>find ()</code> om alle <span>-elementen te vinden die onderliggend zijn aan <p>. In dit voorbeeld is het alleen het woord blauw. We gebruiken dan de <code>css ()</code> methode om de kleur in blauw te veranderen.<br></p> </div>  </div> <p>Bij het tweede gebruik van <code>find ()</code>. Deze keer selecteren we de .<br></p><p>Nogmaals, dit is slechts het groene woord. Wat betreft de eerste regel gebruiken we de <code>css ( )</code> methode om de kleur in groen te veranderen.<br></p><p>Laten we het uitvoeren en kijken wat er gebeurt!<br></p><figure class = X NmmVK1C Z30uO5sa15iVH9aCEO ASkwA4cuqwxOagZqMkO8QpJd AlJeZH2NXXSALKH8lWknoNiwXquCqxMuztLiG CL0FzyoN60rr OR3aktZVCcmRgyHPk7Fd7hsjGON74Pi

Merk op dat de blauwe en g reen-woorden zijn opgenomen in een span-element zonder dat er een klasse of id is toegewezen. We hebben deze woorden weer kunnen isoleren en van kleur kunnen veranderen. Zoals je misschien al geraden had, is dit omdat de belangrijkste elementen van anders zijn.

De

is de ouder van de van het blauwe woord. De is de ouder van de die het woord green bevat.

Dit gebeurde omdat find () de onderliggende elementen vindt van de elementen die als selector worden gebruikt. Laten we toevoegen enige complexiteit en kijk naar een voorbeeld takenlijst.

jQuery find () in een lijst

In dit voorbeeld hebben we een takenlijst. We hebben dingen te doen vandaag, maar we moeten ook dingen uit de winkel kopen om het te doen. Zodra we deze items hebben gekocht, kunnen we ze van de lijst halen en verder gaan met onze dag! Hier is onze lijst:

Hier hebben we onze lijst. We hebben de

  • ;-elementen van "Ga naar winkel", "Prullenbak buitenzetten" en "Doe de afwas" als kinderen van het
  •  9 PKrmYrpttbZVdC MrqVjbqAW3bz5t4QCkiZFYhLIuJqsIhUjTQxC7ipWbdnJOfk1ndFDF EcJuV47VM VtfzQd3vp1JNtWxBuOq8Ku0XjNxp4QrnXybM3veW8Gk6ttETa7fk

    Conclusie

    jQuery zoeken () identificeert alle selector kindelementen dat wordt eraan doorgegeven. De methode verwerkt alleen deze onderliggende elementen en niet de bovenliggende elementen zelf.

    Door onderscheid te kunnen maken tussen de onderliggende elementen die moeten worden geselecteerd, kunnen we algemeen zijn en delen van een pagina bewerken , of specifiek en om alleen bepaalde elementen van een paginaleeftijd te bewerken. Het is in deze flexibiliteit dat find () het nuttigst is.

    Meer informatie over het leren van jQuery < a href="/what-is-jquery-used-for / "> hier .

    Shop

    Learn programming in R: courses

    $

    Best Python online courses for 2022

    $

    Best laptop for Fortnite

    $

    Best laptop for Excel

    $

    Best laptop for Solidworks

    $

    Best laptop for Roblox

    $

    Best computer for crypto mining

    $

    Best laptop for Sims 4

    $

    Latest questions

    NUMPYNUMPY

    psycopg2: insert multiple rows with one query

    12 answers

    NUMPYNUMPY

    How to convert Nonetype to int or string?

    12 answers

    NUMPYNUMPY

    How to specify multiple return types using type-hints

    12 answers

    NUMPYNUMPY

    Javascript Error: IPython is not defined in JupyterLab

    12 answers


    Wiki

    Python OpenCV | cv2.putText () method

    numpy.arctan2 () in Python

    Python | os.path.realpath () method

    Python OpenCV | cv2.circle () method

    Python OpenCV cv2.cvtColor () method

    Python - Move item to the end of the list

    time.perf_counter () function in Python

    Check if one list is a subset of another in Python

    Python os.path.join () method