attr

.attr(name, value)

属性にマッチした要素を処理します。

// GET
.attr('name');

// SET
.attr('name', 'value');
.attr({ name1: 'value', name2: 'value2' });

パラメータ

GET

name: string

取得したい要素の属性名。 同名の属性が複数ある場合、最初にマッチした属性の要素が対象です。

SET

name: string

値をセットしたい要素の属性名。 マッチした全ての属性の要素が対象です。

value: string

属性に指定したい値。 デフォルト値は属性名になります。

戻り値

GET

string

属性の値。

SET

u

Umbrellaのインスタンスを返します。

重要

.attr()メソッドは、 checkedのようなプロパティではなく、属性のみを取得します。 詳しくはjquery's attr() vs prop()を参照してください。

プロパティはそれぞれ違うので、それぞれの値を調べる必要があります。 例えば、checkedが指定された要素を取得する場合、 以下のように指定します。

u('.terms-os-service').is(':checked');

例

画像のalt属性を取得します。

u('img.hero').attr('alt');

全ての画像のsrcを指定します。

u('img').attr({ src: 'demo.jpg' });

デモ

"デモ用文字列"をクリックすると、 "デモ用文字列"が赤、小文字で表示されます。
#demoにsmallクラスとstyleを追加しています。

JavaScript

u('#demo').on('click', function() {
  u(this).attr({ class: 'small', style: 'color:#d50000;' });
});

CSS

.small {
  font-size: 60%;
}

HTML

<span id="demo">デモ用文字列</span>

関連項目

.data() data-*属性にマッチした要素を処理します。