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 July 2015.

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 Standard
# dom-attr-value

ブラウザーの互換性

BCD tables only load in the browser