jQuery: выбрать непустые атрибуты данных?

Question 1

Я пытаюсь выбрать все элементы, у data-go-toкоторых есть непустой атрибут.

Я пробовал, $('[data-go-to!=""]')но, как ни странно, кажется, что если я это сделаю, он выбирает каждый элемент на странице.

Question 2

пытаться

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

ОБНОВИТЬ:

Чтобы никого не сбить с пути, этот ответ будет работать в более старых версиях jQuery, но не пригоден для будущего. Поскольку ответы @gmo и @ siva, похоже, работают с более поздними версиями, я полагаюсь на их ответы (и призываю вас проголосовать за них) ... и, конечно, надеюсь, что у вас фантастический день.

Question 3

Так же в качестве дополнительной ссылки и актуального ^{(май'14) (авг'15) (сен'16) (апр'17) (мар'18) (мар'19) ( май'20 )} ...
Ответ, который работает с:

Пустые строки:

Если должно существовать и иметь какое-либо значение ^{(или вообще}не иметь ⁾attr

    jQuery("[href]");

Отсутствующие атрибуты:

Если может существовать и если существует, должно иметь какое-то значение attr

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

Или оба:

Если должно существовать и иметь какую-то ценность ... attr

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

^{PS : возможны другие комбинации ...}

Посмотрите этот тест в jsFiddle для примеров:

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 ^{Последняя версия jQuery доступна в jsFiddle 28 мая 2020 г.}
jQuery Edge -> jsFiddle online test ^{Версия jQuery edge (используйте с осторожностью)}

Или здесь, в SO с этим фрагментом кода .

^{* Фрагмент работает под управлением jQuery v2.1.1}

Показать фрагмент кода

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>

Развернуть фрагмент

Question 4

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

Question 5

Имеет атрибут data-attributename и его значение не пусто:

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

Пустой атрибут data-attributename или нет:

$('[data-attributename]')

Пример JS Fiddle

Question 6

Я не уверен насчет простого селектора, но вы могли бы использовать filter():

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

Демо JS Fiddle .

Ссылки:

filter().

Question 7

Согласно документации это должно сделать это

:not([attr="value"])

ДЕМО

Надеюсь это поможет

Question 8

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

JSBIN

Question 9

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

Использование :not, .not()и :emptyт. Д. Будет проверять только пустой ли элемент, а не атрибут данных. Для этого вам нужно будет выполнить фильтрацию по значению атрибутов данных.

FIDDLE

Question 10

Это работает для меня

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

Question 11

Попробуй это :

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

Question 12

Это работает для меня:

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

Answer 1

Я пытаюсь выбрать все элементы, у data-go-toкоторых есть непустой атрибут.

Я пробовал, $('[data-go-to!=""]')но, как ни странно, кажется, что если я это сделаю, он выбирает каждый элемент на странице.

Answer 2

77

пытаться

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

ОБНОВИТЬ:

Чтобы никого не сбить с пути, этот ответ будет работать в более старых версиях jQuery, но не пригоден для будущего. Поскольку ответы @gmo и @ siva, похоже, работают с более поздними версиями, я полагаюсь на их ответы (и призываю вас проголосовать за них) ... и, конечно, надеюсь, что у вас фантастический день.

Бенджамин Оман
источник

спасибо, это сработало отлично! Я хотел выбрать только элементы изображения, поэтому добавил $ (': not (img [data-go-to == ""]')

msanjay 04

2

Разве при этом не выбираются все элементы, у которых нет пустого атрибута «данные на ходу»? Когда спрашивающий хочет, чтобы все элементы с этим атрибутом не были пустыми? (как решает ответ Шивы Чарана)

rodnaph

на самом деле не нужны двойные кавычки ... как в $('element:not([attribute=])'); // gets all of <element attribute="">или$(':not([attribute=])'); // gets all of <* attribute="">

Энтони Хацопулос

2

Это получает каждый элемент для меня, включая тот, который имеет атрибут данных, который я ищу

Адвокат дьявола

В Safari вроде не работает, но $('[data-go-to!=""]:[data-go-to]')работает.

Дэн

Answer 3

спасибо, это сработало отлично! Я хотел выбрать только элементы изображения, поэтому добавил $ (': not (img [data-go-to == ""]')

msanjay 04

Answer 4

2

Разве при этом не выбираются все элементы, у которых нет пустого атрибута «данные на ходу»? Когда спрашивающий хочет, чтобы все элементы с этим атрибутом не были пустыми? (как решает ответ Шивы Чарана)

rodnaph

Answer 5

на самом деле не нужны двойные кавычки ... как в $('element:not([attribute=])'); // gets all of <element attribute="">или$(':not([attribute=])'); // gets all of <* attribute="">

Энтони Хацопулос

Answer 6

2

Это получает каждый элемент для меня, включая тот, который имеет атрибут данных, который я ищу

Адвокат дьявола

Answer 7

В Safari вроде не работает, но $('[data-go-to!=""]:[data-go-to]')работает.

Дэн

Answer 8

Так же в качестве дополнительной ссылки и актуального ^{(май'14) (авг'15) (сен'16) (апр'17) (мар'18) (мар'19) ( май'20 )} ...
Ответ, который работает с:

Пустые строки:

Если должно существовать и иметь какое-либо значение ^{(или вообще}не иметь ⁾attr

    jQuery("[href]");

Отсутствующие атрибуты:

Если может существовать и если существует, должно иметь какое-то значение attr

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

Или оба:

Если должно существовать и иметь какую-то ценность ... attr

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

^{PS : возможны другие комбинации ...}

Посмотрите этот тест в jsFiddle для примеров:

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 ^{Последняя версия jQuery доступна в jsFiddle 28 мая 2020 г.}
jQuery Edge -> jsFiddle online test ^{Версия jQuery edge (используйте с осторожностью)}

Или здесь, в SO с этим фрагментом кода .

^{* Фрагмент работает под управлением jQuery v2.1.1}

Показать фрагмент кода

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>

Развернуть фрагмент

Answer 9

6

это оно. Проголосуйте за этого пользователя прямо здесь. другие старые ответы не работают для меня. Я использовал третий пример.

Valamas

Answer 10

Seconded @ Valamas-AUS

Адам Уэйт

Answer 11

Изменить: добавлен фрагмент кода SO, поэтому вы можете протестировать его прямо здесь.

gmo

Answer 12

Это тот, который работает. $(':not([data-go-to=""])')больше не работает

Matthieu Charbonnier

Answer 13

1

Спасибо за актуальный ответ

Энтони Си,

Answer 14

19

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

Шива Чаран
источник

6

Этот работает для пустых строк и отсутствующих атрибутов, отлично

adamJLev

4

по состоянию на 14 мая не работает, выдает Unrecognized Expressionошибку.

coding_idiot

Answer 15

6

Этот работает для пустых строк и отсутствующих атрибутов, отлично

adamJLev

Answer 16

4

по состоянию на 14 мая не работает, выдает Unrecognized Expressionошибку.

coding_idiot

Answer 17

7

Имеет атрибут data-attributename и его значение не пусто:

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

Пустой атрибут data-attributename или нет:

$('[data-attributename]')

Пример JS Fiddle

Джелгаб
источник

1

Это единственный ответ, который все еще работает для меня в июне 2015 года.

AlexioVay 02

Answer 18

1

Это единственный ответ, который все еще работает для меня в июне 2015 года.

AlexioVay 02

Answer 19

Я не уверен насчет простого селектора, но вы могли бы использовать filter():

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

Демо JS Fiddle .

Ссылки:

filter().

Answer 20

4

Согласно документации это должно сделать это

:not([attr="value"])

ДЕМО

Надеюсь это поможет

Дхирадж
источник

Answer 21

3

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

JSBIN

Shanimal
источник

Answer 22

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

Использование :not, .not()и :emptyт. Д. Будет проверять только пустой ли элемент, а не атрибут данных. Для этого вам нужно будет выполнить фильтрацию по значению атрибутов данных.

FIDDLE

Answer 23

1

Это работает для меня

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

Мардок
источник

Однако это две итерации.

Йенс

Answer 24

Однако это две итерации.

Йенс

Answer 25

0

Попробуй это :

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

Паскаль Бутин
источник

1

Нет. "Syntax error, unrecognized expression: [data-go-to:not(:empty)]"

Шпигфорд

api.jquery.com/empty-selector api.jquery.com/not-selector В соответствии с этим, должно быть, должно работать, к сожалению, это было бы чистое решение!

Паскаль Бутин

Answer 26

1

Нет. "Syntax error, unrecognized expression: [data-go-to:not(:empty)]"

Шпигфорд

Answer 27

api.jquery.com/empty-selector api.jquery.com/not-selector В соответствии с этим, должно быть, должно работать, к сожалению, это было бы чистое решение!

Паскаль Бутин

Answer 28

0

Это работает для меня:

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

ВКонтакте
источник

jQuery: выбрать непустые атрибуты данных?

Ответы:

Пустые строки:

Отсутствующие атрибуты:

Или оба:

Посмотрите этот тест в jsFiddle для примеров:

Или здесь, в SO с этим фрагментом кода .