このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

Attr: value プロパティ

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨2015年7月⁩.

valueAttr インターフェイスのプロパティで、この属性の値が入ります。

文字列で、この属性の値を表します。

次の例では、属性 test の現在の値を表示しています。ボタンをクリックすると別の値に変更され、再度読み込むと表示値が更新されます。

HTML コンテンツ

html
<label test="初期値"></label>

<button>クリックすると、test に <code>"新しい値"</code> を設定します。…</button>

<p>
  現在の <code>test</code> 属性の値:
  <output id="result">なし。</output>
</p>

JavaScript コンテンツ

js
const element = document.querySelector("label");
const button = document.querySelector("button");
const result = document.querySelector("#result");

const attribute = element.attributes[0];
result.value = attribute.value;

button.addEventListener("click", () => {
  attribute.value = "新しい値";
  result.value = attribute.value;
});

結果

仕様書

Specification
DOM
# dom-attr-value

ブラウザーの互換性