【jQuery】data属性に特定の値を持つ要素を指定する方法。

めも。

単に要素内に特定の値を持つノードを選択したいのであれば、下記のように「:contains()」を用いれば拾える。

■HTML

<div data-hoge="fuga">piyo</div>

■jQuery

$(function(){
	var elem = $('div:contains("piyo")');
	console.log(elem.data('hoge'));
})
[console]
fuga

これをどうにかごにょごにょして、data属性に特定の値を持つノードを選択できないかと色々調べてみたけれど、結局以下のようにするしかなさそう(?)な感じがした。

■HTML

<div data-hoge="fuga">piyo</div>

■jQuery

$(function(){
	var elem = $('[data-hoge="fuga"]');
	console.log(elem.text());
})
[console]
piyo

とりあえず動作は問題ないけど、もっとスマートな記述方法はないだろうか。属性セレクタはパフォーマンスがクッソ重いからなるべくなら使いたくないところ。
見つけたらもっかいまとめよう。