SimpleQueries

SimpleQueries é um pacote que vai trazer a abstração de algumas queries que são bastante utilizada para manipulação de elementos HTML

Como utilizar o SimpleQueries

Via npm

npm install simplequeries

Para fazer a chamada no seu projeto basta fazer o import

import sq from 'simplequeries'

sq.click('btnLogin', () => {
    // Esta função de callback será executada quando o botão com id
    // btnLogin for clicado

    alert('Você clicou no botão')
})

sq.addClass('btnRegister', ['mt-2', 'bg-red-500', 'font-bold'])

sq.contains('btnLogin', 'h-2') //Irá verificar se o btn login tem a class h-2 e retornará true or false

sq.contains('btnLogin', 'h-2', () => {
    //Passando um callback, caso a validação for verdadeira
    //O callback é executado

    alert('class h-2 está contida em btnLogin')
}) 

• sq.click(id, callback): Esta função irá buscar o elemento html com o ID informado, e irá adicionar um 'addEventListener' já com o event.preventDefault() e executar a função de callback quando o elemento HTML for clicado

• sq.addClass(id, className): Esta função irá adicionar uma classe à lista de classes do elemento HTML

• sq.removeClass(id, className): Esta função irá remover uma classe da lista de classes do elemento HTML

• sq.contains(id, className, callback): Esta função irá verificar se a class está contida dentro da lista de classes do elemento HTML, e se estiver, irá executar a função de callback.

• sq.value(id, newValue): Esta função irá pegar o value de um elemento html, e caso seja passado o parâmetro newValue a função irá alterar o value do elemento HTML.