jquery - JQueryを使用してカスタム属性に値を追加する方法は?

Question

「div.tile」要素があります。それぞれに、次のようなカスタム属性「dist」があります。

<div class="tile" dist="dist-3"></div>

ここで、属性「dist」に「dist-5」値を追加します。このような：

<div class="tile" dist="dist-3 dist-5"></div>

これどうやってするの？

検索したところ、次のことがわかりました。

$('.tile').each(function(){ this.dist += "dist-5"; })

しかし、ご想像のとおり、これは機能しません。

私はそれを行うためのエレガントな方法を探していますtile.attr('dist', tile.attr('dist')+' '+'dist-5')

Answer 1

関数をパラメーターとして受け取る .attr()セッターを使用する必要があります

$('.tile').attr('dist', function (id, attr) {
    return attr + " dist-5";
})

デモ:フィドル