Elemento de pesquisa Javascript

| | |

O método jQuery find () pode parecer familiar, mas não o confunda com o método JavaScript find()! Ambos "encontram" coisas, mas o que elas retorno pode ser muito diferente. Em JavaScript, o método find() só pode ser chamado em uma matriz.

Requer uma função de retorno de chamada, que é uma função passada para um método como argumento, para ligar mais tarde. Localiza e retorna o primeiro item que atende aos requisitos descritos na função de retorno de chamada.

O método find () do jQuery é bem diferente. Como todos os métodos jQuery, ele é chamado em um seletor. Pesquise neste seletor e manipule apenas os elementos filho deste seletor. Este alto nível de manipulação é útil se você deseja modificar alguns elementos e não outros que estão contidos no mesmo elemento pai.

Usando jQuery find()

Agora sabemos jQuery find() é usado para selecionar todos os elementos filhos de um determinado seletor. Confira alguns exemplos de código para ver como usar jQuery find().

Vamos começar simples e adicionar alguma complexidade nas seções a seguir. Podemos manipular um elemento após o carregamento da página para demonstrar como find() funciona. Que tal mudar a cor de algumas palavras no contexto de um parágrafo após o carregamento da página? Começaremos daqui:

Todas as outras palavras permanecerão iguais.

Olhe para este código e você notará dentro das

algumas elementos . Um dos elementos é filho do elemento

. O outro é filho do

< classe face = "wp-image-block"> IR3bnpJdRzIwsq 1CzCQeT4Lf2F4YaVtdHjwqHecFlqkjNYR Oi9DIefQs IX6Kf1Bh0JQQNYqxQG7okIP98RPQ PYHTDhu AOabwfhnwB4rdWRmoMw5WgSDtLIKD5ZU9b4 é HTML <HTDML> Vamos agora mudar o cores do texto para ilustrar <code>find()</code> em ação. Este é um ótimo passo para iniciantes, pois só precisamos modificar um atributo CSS para conseguir isso. Passando o elemento <p>como seletor para <code>find()</code>, podemos usar o método <code>css()</code> do jQuery para fazer as mudanças de cor:</p> <p>Ao usar <code>find() </code> pela primeira vez, selecionamos todos os elementos <p>. Usamos <code>find()</code> para encontrar todos os elementos <span> que são filhos de <p>. Neste exemplo, é apenas a palavra azul. Em seguida, usamos o método <code>css()</code> para alterar a cor para azul.<br></p> </div>  </div> <p>No segundo uso de <code>find()</code>. Desta vez, selecionamos o .<br></p><p>Novamente, esta é apenas a palavra verde. Quanto à primeira linha, usamos o <code>css ( )</code> para alterar a cor para verde.<br></p><p>Vamos executá-lo e ver o que acontece!<br></p><figure class = X NmmVK1C Z30uO5sa15iVH9aCEO ASkwA4cuqwxOagZqMkO8QpJd AlJeZH2NXXSALKH8lWknoNiwXquCqxMuztLiG CL0FzyoN60rr OR3aktZVCcmRgyHPk7Fd7hsjGON74Pi

Note-se que o azul e g palavras reen foram incluídas em um elemento span sem nenhuma classe ou id atribuído. Conseguimos isolar essas palavras novamente e mudar sua cor. Como você deve ter adivinhado, isso ocorre porque os principais elementos de são diferentes.

O

é o pai do da palavra azul. O é o pai do que contém a palavra green.

Isso aconteceu porque find () encontra os filhos dos elementos usados como seletor. Vamos adicionar alguma complexidade e veja um exemplo de lista de tarefas.

jQuery find () em uma lista

Neste exemplo, temos uma lista de tarefas. Temos coisas para fazer hoje, mas também temos que comprar coisas na loja para fazer isso. Depois de comprar esses itens, podemos tirá-los da lista e continuar com o nosso dia! Aqui está nossa lista:

Aqui temos nossa lista. Temos os elementos

  • ; de "Ir para a loja", "Tirar o lixo" e "Lavar a louça" como filhos do elemento
  •  9_pKrmYrpttbZVd C-_mrqVjbqAW3bz5t4QCkiZFYhLIuJqsIhUjTQxC7ipWbdnJOfk1ndFDF-EcJuV47VM_vtfzQd3vp1JNtWxBuOq8Ku0XjNxp4QrnXybM3veW8Gk6ttETa7fk_ 9 PKrmYrpttbZVdC MrqVjbqAW3bz5t4QCkiZFYhLIuJqsIhUjTQxC7ipWbdnJOfk1ndFDF EcJuV47VM VtfzQd3vp1JNtWxBuOq8Ku0XjNxp4QrnXybM3veW8Gk6ttETa7fk

    Conclusão

    jQuery find () identifica todos os elementos seletor de criança que é passado para ele. O método irá lidar apenas com esses elementos filho e não o pai em si.

    Ser capaz de diferenciar os filhos a serem selecionados nos permite ser gerais e editar seções inteiras de uma página , ou específico e para editar apenas alguns elementos de uma idade de página. É nessa flexibilidade que find() é mais útil.

    Saiba mais sobre como aprender jQuery < a href="/what-is-jquery-used-for / "> aqui .

    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