jQuery: Wybierz atrybuty danych, które nie są puste?

Question 1

Próbuję wybrać wszystkie elementy, które mają data-go-toatrybut, który nie jest pusty.

Próbowałem, $('[data-go-to!=""]')ale, co dziwne, wydaje się, że wybiera każdy element na stronie, jeśli to zrobię.

Question 2

próbować

$(':not([data-go-to=""])')

AKTUALIZACJA:

Aby nikogo nie sprowadzić na manowce, ta odpowiedź będzie działać w starszych wersjach jQuery, ale nie jest przyszłościowa. Ponieważ odpowiedzi @gmo i @ siva wydają się działać z późniejszymi wersjami, odkładam (i zachęcam cię do głosowania) ich odpowiedzi ... i oczywiście mam nadzieję, że masz fantastyczny dzień.

Question 3

Jako dalsze odniesienie i aktualne ^{(maj'14) (sierpień'15) (wrz'16) (kwi'17) (mar'18) (mar'19) ( maj'20 )} ...
Odpowiedź, która działa z:

Puste ciągi:

Jeśli musi istnieć i może mieć jakąkolwiek wartość ^{(lub wcale)}attr

    jQuery("[href]");

Brakujące atrybuty:

Jeśli mogłoby istnieć, a jeśli istnieje, musi mieć jakąś wartość attr

    jQuery("[href!='']");

Lub obydwa:

Jeśli musi istnieć i musi mieć jakąś wartość ... attr

    jQuery("[href!=''][href]");

^{PS : więcej kombinacji jest możliwych ...}

Sprawdź ten test w jsFiddle, aby zobaczyć przykłady:

jQuery v1.11.0 -> jsFiddle online test
jQuery v2.1.0 -> jsFiddle online test
jQuery v2.1.3 -> jsFiddle online test
jQuery v3.0.0-alpha1 -> jsFiddle online test
jQuery v3.1.1 Slim -> jsFiddle online test
jQuery v3.2.1 -> jsFiddle online test
jQuery v3.3.1 -> jsFiddle online test
jQuery v3.4.1 -> jsFiddle online test ^{Ostatnia wersja jQuery dostępna w jsFiddle w maju 28'20}
jQuery Edge -> jsFiddle online test ^{Wersja jQuery Edge (używaj ostrożnie)}

Lub tutaj w SO z tym fragmentem kodu .

^{* Snippet korzysta z jQuery v2.1.1}

Pokaż fragment kodu

jQuery('div.test_1 > a[href]').addClass('match');
jQuery('div.test_2 > a[href!=""]').addClass('match');
jQuery('div.test_3 > a[href!=""][href]').addClass('match');

div,a {
    display: block;
    color: #333;
    margin: 5px;
    padding: 5px;
    border: 1px solid #333;
}
h4 {
    margin: 0;
}
a {
    width: 200px;
    background: #ccc;
    border-radius: 2px;
    text-decoration: none;
}
a.match {
    background-color: #16BB2A;
    position: relative;
}
a.match:after {
    content: 'Match!';
    position: absolute;
    left: 105%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test_1">
    <h4>Test 1: jQuery('a[href]')</h4>
    <a href="test">href: test</a>
    <a href="#">href: #</a>
    <a href="">href: empty</a>
    <a>href: not present</a>
</div>
<div class="test_2">
    <h4>Test 2: jQuery('a[href!=""]')</h4>
    <a href="test">href: test</a>
    <a href="#">href: #</a>
    <a href="">href: empty</a>
    <a>href: not present</a>
</div>
<div class="test_3">
    <h4>Test 3: jQuery('a[href!=""][href]')</h4>
    <a href="test">href: test</a>
    <a href="#">href: #</a>
    <a href="">href: empty</a>
    <a>href: not present</a>
</div>

Rozwiń fragment

Question 4

$('[data-go-to!=""]:[data-go-to]').each(function() {
    // Do Your Stuff
});

Question 5

Zawiera atrybut „data-attributeame”, a jego wartość nie jest pusta:

$('[data-attributename]:not([data-attributename=""])')

Czy atrybut „nazwa-atrybutu danych” jest pusty lub nie:

$('[data-attributename]')

Przykład JS Fiddle

Question 6

Nie jestem pewien co do prostego selektora, ale możesz użyć filter():

$('[data-go-to]').filter(
    function(){
        return ($(this).attr('data-go-to').length > 0);
    });

Demo JS Fiddle .

Bibliografia:

filter().

Question 7

Zgodnie z dokumentacją powinno to wystarczyć

:not([attr="value"])

PRÓBNY

Mam nadzieję że to pomoże

Question 8

$('[data-go-to]:not([data-go-to=""])')

JSBIN

Question 9

$('[data-go-to]').filter(function() {
    return $(this).data('go-to')!="";
});

Korzystanie z :not, .not(), :emptyetc będzie sprawdzać tylko wtedy, gdy sam element jest pusty, nie atrybut danych. W tym celu będziesz musiał filtrować na podstawie wartości atrybutów danych.

SKRZYPCE

Question 10

To działa dla mnie

$('[attributename]').filter('[attributename!=""]')

Question 11

Spróbuj tego :

$('[data-go-to:not(:empty)]')

Question 12

To działa dla mnie:

$('.data .title td[data-field!=""]')

Answer 1

96

Próbuję wybrać wszystkie elementy, które mają data-go-toatrybut, który nie jest pusty.

Próbowałem, $('[data-go-to!=""]')ale, co dziwne, wydaje się, że wybiera każdy element na stronie, jeśli to zrobię.

javascript jquery jquery-selectors custom-data-attribute Shpigford
źródło

Answer 2

77

próbować

$(':not([data-go-to=""])')

AKTUALIZACJA:

Aby nikogo nie sprowadzić na manowce, ta odpowiedź będzie działać w starszych wersjach jQuery, ale nie jest przyszłościowa. Ponieważ odpowiedzi @gmo i @ siva wydają się działać z późniejszymi wersjami, odkładam (i zachęcam cię do głosowania) ich odpowiedzi ... i oczywiście mam nadzieję, że masz fantastyczny dzień.

Benjamin Oman
źródło

dzięki, to działało świetnie! Chciałem zaznaczyć tylko elementy obrazu, więc dodałem $ (': not (img [data-go-to == ""]')

msanjay

2

Czy to nie powoduje wybrania wszystkich elementów, które nie mają pustego atrybutu „dane do wykorzystania”? Kiedy pytający chce wszystkie elementy z tym atrybutem, które nie są puste? (zgodnie z odpowiedzią Sivy Charana)

rodnaph,

naprawdę nie potrzebuję żadnych podwójnych cudzysłowów ... jak w $('element:not([attribute=])'); // gets all of <element attribute="">lub$(':not([attribute=])'); // gets all of <* attribute="">

Anthony Hatzopoulos

2

To dostaje dla mnie każdy element, w tym ten, który ma atrybut danych, którego szukam

Devil's Advocate

Wydaje się, że nie działa w Safari, ale $('[data-go-to!=""]:[data-go-to]')tak.

Dan

Answer 3

dzięki, to działało świetnie! Chciałem zaznaczyć tylko elementy obrazu, więc dodałem $ (': not (img [data-go-to == ""]')

msanjay

Answer 4

2

Czy to nie powoduje wybrania wszystkich elementów, które nie mają pustego atrybutu „dane do wykorzystania”? Kiedy pytający chce wszystkie elementy z tym atrybutem, które nie są puste? (zgodnie z odpowiedzią Sivy Charana)

rodnaph,

Answer 5

naprawdę nie potrzebuję żadnych podwójnych cudzysłowów ... jak w $('element:not([attribute=])'); // gets all of <element attribute="">lub$(':not([attribute=])'); // gets all of <* attribute="">

Anthony Hatzopoulos

Answer 6

2

To dostaje dla mnie każdy element, w tym ten, który ma atrybut danych, którego szukam

Devil's Advocate

Answer 7

Wydaje się, że nie działa w Safari, ale $('[data-go-to!=""]:[data-go-to]')tak.

Dan

Answer 8

Jako dalsze odniesienie i aktualne ^{(maj'14) (sierpień'15) (wrz'16) (kwi'17) (mar'18) (mar'19) ( maj'20 )} ...
Odpowiedź, która działa z:

Puste ciągi:

Jeśli musi istnieć i może mieć jakąkolwiek wartość ^{(lub wcale)}attr

    jQuery("[href]");

Brakujące atrybuty:

Jeśli mogłoby istnieć, a jeśli istnieje, musi mieć jakąś wartość attr

    jQuery("[href!='']");

Lub obydwa:

Jeśli musi istnieć i musi mieć jakąś wartość ... attr

    jQuery("[href!=''][href]");

^{PS : więcej kombinacji jest możliwych ...}

Sprawdź ten test w jsFiddle, aby zobaczyć przykłady:

jQuery v1.11.0 -> jsFiddle online test
jQuery v2.1.0 -> jsFiddle online test
jQuery v2.1.3 -> jsFiddle online test
jQuery v3.0.0-alpha1 -> jsFiddle online test
jQuery v3.1.1 Slim -> jsFiddle online test
jQuery v3.2.1 -> jsFiddle online test
jQuery v3.3.1 -> jsFiddle online test
jQuery v3.4.1 -> jsFiddle online test ^{Ostatnia wersja jQuery dostępna w jsFiddle w maju 28'20}
jQuery Edge -> jsFiddle online test ^{Wersja jQuery Edge (używaj ostrożnie)}

Lub tutaj w SO z tym fragmentem kodu .

^{* Snippet korzysta z jQuery v2.1.1}

Pokaż fragment kodu

jQuery('div.test_1 > a[href]').addClass('match');
jQuery('div.test_2 > a[href!=""]').addClass('match');
jQuery('div.test_3 > a[href!=""][href]').addClass('match');

div,a {
    display: block;
    color: #333;
    margin: 5px;
    padding: 5px;
    border: 1px solid #333;
}
h4 {
    margin: 0;
}
a {
    width: 200px;
    background: #ccc;
    border-radius: 2px;
    text-decoration: none;
}
a.match {
    background-color: #16BB2A;
    position: relative;
}
a.match:after {
    content: 'Match!';
    position: absolute;
    left: 105%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test_1">
    <h4>Test 1: jQuery('a[href]')</h4>
    <a href="test">href: test</a>
    <a href="#">href: #</a>
    <a href="">href: empty</a>
    <a>href: not present</a>
</div>
<div class="test_2">
    <h4>Test 2: jQuery('a[href!=""]')</h4>
    <a href="test">href: test</a>
    <a href="#">href: #</a>
    <a href="">href: empty</a>
    <a>href: not present</a>
</div>
<div class="test_3">
    <h4>Test 3: jQuery('a[href!=""][href]')</h4>
    <a href="test">href: test</a>
    <a href="#">href: #</a>
    <a href="">href: empty</a>
    <a>href: not present</a>
</div>

Rozwiń fragment

Answer 9

6

to jest to. Głosuj na tego użytkownika tutaj. inne starsze odpowiedzi nie działają dla mnie. Posłużyłem się trzecim przykładem.

Valamas,

Answer 10

Oddelegowany @ Valamas-AUS

Adam Waite

Answer 11

Edycja: Dodano fragment kodu SO, więc możesz go przetestować tutaj.

gmo

Answer 12

To jest ten, który działa. $(':not([data-go-to=""])')już nie działa

Matthieu Charbonnier

Answer 13

1

Dzięki za aktualizację odpowiedzi

Anthony C

Answer 14

19

$('[data-go-to!=""]:[data-go-to]').each(function() {
    // Do Your Stuff
});

Siva Charan
źródło

6

Ten działa dla pustych ciągów i brakujących atrybutów, idealnie

adamJLev

4

od 14 maja nie działa, podaje Unrecognized Expressionbłąd.

coding_idiot

Answer 15

6

Ten działa dla pustych ciągów i brakujących atrybutów, idealnie

adamJLev

Answer 16

4

od 14 maja nie działa, podaje Unrecognized Expressionbłąd.

coding_idiot

Answer 17

7

Zawiera atrybut „data-attributeame”, a jego wartość nie jest pusta:

$('[data-attributename]:not([data-attributename=""])')

Czy atrybut „nazwa-atrybutu danych” jest pusty lub nie:

$('[data-attributename]')

Przykład JS Fiddle

Jelgab
źródło

1

To jedyna odpowiedź, która nadal działa dla mnie w czerwcu 2015 r.

AlexioVay

Answer 18

1

To jedyna odpowiedź, która nadal działa dla mnie w czerwcu 2015 r.

AlexioVay

Answer 19

Nie jestem pewien co do prostego selektora, ale możesz użyć filter():

$('[data-go-to]').filter(
    function(){
        return ($(this).attr('data-go-to').length > 0);
    });

Demo JS Fiddle .

Bibliografia:

filter().

Answer 20

4

Zgodnie z dokumentacją powinno to wystarczyć

:not([attr="value"])

PRÓBNY

Mam nadzieję że to pomoże

Dhiraj
źródło

Answer 21

3

$('[data-go-to]:not([data-go-to=""])')

JSBIN

Shanimal
źródło

Answer 22

$('[data-go-to]').filter(function() {
    return $(this).data('go-to')!="";
});

Korzystanie z :not, .not(), :emptyetc będzie sprawdzać tylko wtedy, gdy sam element jest pusty, nie atrybut danych. W tym celu będziesz musiał filtrować na podstawie wartości atrybutów danych.

SKRZYPCE

Answer 23

1

To działa dla mnie

$('[attributename]').filter('[attributename!=""]')

Mardok
źródło

Są to jednak dwie iteracje.

Jens

Answer 24

Są to jednak dwie iteracje.

Jens

Answer 25

0

Spróbuj tego :

$('[data-go-to:not(:empty)]')

Pascal Boutin
źródło

1

Nie idź. "Syntax error, unrecognized expression: [data-go-to:not(:empty)]"

Shpigford

api.jquery.com/empty-selector api.jquery.com/not-selector Zgodnie z tym, przypuszczam, że zadziała, smutno, to byłoby czyste rozwiązanie!

Pascal Boutin

Answer 26

1

Nie idź. "Syntax error, unrecognized expression: [data-go-to:not(:empty)]"

Shpigford

Answer 27

api.jquery.com/empty-selector api.jquery.com/not-selector Zgodnie z tym, przypuszczam, że zadziała, smutno, to byłoby czyste rozwiązanie!

Pascal Boutin

Answer 28

0

To działa dla mnie:

$('.data .title td[data-field!=""]')

VK
źródło

jQuery: Wybierz atrybuty danych, które nie są puste?

Odpowiedzi:

Puste ciągi:

Brakujące atrybuty:

Lub obydwa:

Sprawdź ten test w jsFiddle, aby zobaczyć przykłady:

Lub tutaj w SO z tym fragmentem kodu .