jquery-data-filter-js

GodahTech - Jquery Data Filter JS

Filtrar e atualizar o elemento pelo atributo '.data' ou dados que possuem valor do atributo específico.

Filter and update the element by the '.data' attribute or data that has a specific attribute value.

Godahtech | Soluções Digitais - Roberto W. Godoy

Version 1.0.8

🛡 Pode Confiar

📦 Instalação

npm i jquery-data-filter-js

🔨 Usando:

HTML

<div id="person-list">
    <p class="filter-me" data-age="12">
        Henrique, age 12
    </p>
    <p class="filter-me" data-age="15">
        Noop, age 15
    </p>
    <p class="filter-me" data-age="14">
        Raquel, age 14
    </p>
    <p class="filter-me" data-age="14">
        Godoy, age 14
    </p>
    <p class="filter-me" data-city="São Paulo">
        Godoy
    </p>
    <p class="filter-me" data-city="Paraíba">
        Henrique
    </p>
    <p class="filter-me" data-city="Paraíba">
        Goreth
    </p>
    <p class="filter-me" data-city="Paraíba">
        Iracy
    </p>
    <p class="filter-me" data-city="Paraíba">
        Raquel
    </p>
    <p class="filter-me" data-city="São Paulo">
        Leandro
    </p>
</div>

JAVASCRIPT

    $(document).ready(function () {

        console.log($(".filter-me").filterData("person").length);
        //Output: 0

        console.log($(".filter-me").filterData("age").length);
        //Output: 4

        console.log($(".filter-me").filterData("age", 12).length);
        //Output: 1
        
        console.log($(".filter-me").filterData("age", 14).first().text());
        //Output: Raquel, age 14

        console.log($(".filter-me").filterData("age", 14, 10).first().text("Raquel, age 10").text());
        //Output: Raquel, age 10
        
        console.log($(".filter-me").filterData("age", 10).length);
        //Output: 2
        
        console.log($(".filter-me").filterData("age", 14).length);
        //Output: 0

        console.log($(".filter-me").filterData("city").length);
        //Output: 6

        console.log($(".filter-me").filterData("city", "São Paulo").length);
        //Output: 2

        console.log($(".filter-me").filterData("city", "São Paulo").text());
        //Output: Godoy, Leandro

        console.log($(".filter-me").filterData("age", 10).first().text());
        //Output: Raquel, age 10

        console.log($(".filter-me").filterData("city", "Paraíba").eq(2).text());
        //Output: Iracy

    });

🌍 Suporte aos ambientes

• Navegadores modernos e Internet Explorer 11

IE / Edge	Firefox	Chrome	Safari	Opera	Electron
IE11, Edge	últimas 2 versões	últimas 2 versões	últimas 2 versões	últimas 2 versões	últimas 2 versões

🖥 Desenvolvimento

Use Gitpod, um ambiente de desenvolvimento online para GitHub.

Ou clone localmente:

$ git clone https://github.com/godoyrw/jquery-data-filter.git
$ cd jquery-data-filter
$ npm install
$ npm start

❤️ Licença e Log de Atualizações

O Jquery Data Filter JS está disponível gratuitamente sob a licença MIT.
Use-o, aprenda com ele, bifurque-o, melhore-o, mude-o, adapte-o às suas necessidades.

---

- Version 1.0.7@last - Filtrar e atualizar o elemento pelo atributo '.data' ou dados que possuem valor do atributo específico.

---

• Version 1.0.0 - Filtrar o elemento pelo atributo '.data' ou dados que possuem valor do atributo específico.

---