jQuery：空でないデータ属性を選択しますか？

data-go-to空ではない属性を持つすべての要素を選択しようとしています。

私は試しました$('[data-go-to!=""]')が、奇妙なことに、ページ上ですべての要素を選択しているように見えます。

試す

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

更新：

だれをも迷わせないために、この回答は古いバージョンのjQueryで機能しますが、将来性はありません。@gmoと@sivaの回答はどちらも新しいバージョンで動作しているようですので、回答を延期します（そして、賛成することをお勧めします）。

同様に、さらに最新の ^{（may'14） （aug'15） （sep'16） （apr'17） （mar'18） （mar'19）（may'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 ^{jsFiddleで利用可能な最後のjQueryバージョン}
• jQuery Edge -> jsFiddle online test ^{jQueryエッジバージョン（注意して使用）}

または、このコードスニペットを使用して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>

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

'data-attributename'があり、その値は空ではありません：

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

'data-attributename'が空かどうか：

$('[data-attributename]')

JS Fiddleの例

単純なセレクターについてはわかりませんが、次のように使用できますfilter()。

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

JS Fiddleデモ。

参照：

• filter()。

ドキュメントによると、 これはそれを行うべきです

:not([attr="value"])

デモ

お役に立てれば

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

JSBIN

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

使用して:not、.not()、:empty要素自体が空の場合などのみではなく、データの属性をチェックします。そのためには、データ属性値に基づいてフィルタリングする必要があります。

FIDDLE

これは私のために働く

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

これを試して ：

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

これは私にとってはうまくいきます：

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