Scribd
Carregar
7 visualizações3 páginas

Funções Java Script

O documento aborda funções de arrays em JavaScript, como length, push, pop, shift, filter, every, some e includes, com exemplos de uso. Também discute a manipulação do DOM, incluindo seleção de elementos com métodos como getElementsByTagName, getElementById, getElementsByClassName, querySelector e querySelectorAll, além de eventos de clique. Por fim, menciona a manipulação de elementos e o método children para acessar filhos diretos de um elemento.

Enviado por

Sergio Chrisanto
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd
7 visualizações3 páginas

Funções Java Script

O documento aborda funções de arrays em JavaScript, como length, push, pop, shift, filter, every, some e includes, com exemplos de uso. Também discute a manipulação do DOM, incluindo seleção de elementos com métodos como getElementsByTagName, getElementById, getElementsByClassName, querySelector e querySelectorAll, além de eventos de clique. Por fim, menciona a manipulação de elementos e o método children para acessar filhos diretos de um elemento.

Enviado por

Sergio Chrisanto
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato DOCX, PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 3

Java Script - Funções de Arrays

length - mostra quantos itens tem no arrays


exemplo: nome_do_array.length
push - adiciona um item no array
exemplo: nome_do_array.push('novo_item')
pop - remove o ultimo item do array
exemplo: nome_do_array.pop()
shift - remove o primeiro item do array
exemplo: nome_do_array.shift()
filter - filtra os itens do array
exemplo: nome_do_array.filter((value) => value.length > 4)
retorna os itens com mais de 4 caracteres
every - se todos os itens atenderem uma determinada condição, retorna
true
exemplo: nome_do_array.every((valeu) => value.length > 3)
retorna true caso todos os itens do array tiverem mais de 3 caracteres, caso
contrário retorna false
some - se algum(s) itens atenderem a uma determinada condição, retorna
true
exemplo: nome_do_array.every((valeu) => value.length > 3)
caso no array exista algum item com mais de 3 caracteres, retorna true
includes - filtra o item informado no parâmetro
exemplo: if(nome_do_array.includes('Uva') {console.log('Tem uva sim')}
else {console.log('Não tem uva')})
caso no array exista algum item com a string Uva, retorna true

DOM - Document Object Model


Selecionando elementos

document.getElementsByTagName("h1")
seleciona todos os elementos h1 do documento gerando um array
let elementos = document.getElementsByTagName("h1")
elementos[0]
<h1> Olá Javascript </h1>
elementos[1]
<h1> Outro título </h1>
documento.getElementById("teste")
<div id="teste"> Bla bla bla></div>
seleciona o elemento pelo ID
document.getElementsByClassName("botao")
<button class="botao">Clique aqui</buttom>
seleciona o elemento pela classe
document.querySelector("#teste")
<div id="teste"> Bla bla bla </div>
document.querySelector(".botao")
<button class="botao">Clique em mim</button>
document.querySelector("h1")
<h1>Olá Javascript</h1>
O querySelector seleciona o elemento(s) como no css e retorna o elemento
e não um array como no querySelectorAll

document.querySelectorAll("#teste ul li")
NodeList(2) [li, li]
O querySelectorAll seleciona o elemento(s) como no css e sempre retorna
um array

DOM - Document Object Model


Eventos de click

<button class="botao" onClick="clicou()">Clique em mim</button>

function clicou() {
console.log("Clicou no botão")
}

Outra opção é fazer toda a rotina pelo javascript

<button class="botao">Clique em mim</button>

let botao = document.querySelector('.botao')


botao.addEventListener("click", () => {
clicou()
})

DOM - Document Object Model


Manipulação de elementos
Método children – Retorna um array com os filhos diretos do elemento

function clicou() {
const teste = document.querySelector('#teste')
console.log(teste.children)
}

Retorno
<div id="teste">
<ul>
<li>Algum item</li>
<li>Algum item 2</li>
</ul>
</div>

Para retornar o filho do filho

function clicou() {
const teste = document.querySelector('#teste')
console.log(teste.children[0].children)
}

Você também pode gostar

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy