属性値の取得

概要: このチュートリアルでは、getAttribute()メソッドを使用して要素の属性値を取得する方法を学びます。

要素の属性値を取得するには、getAttribute()メソッドを使用します。

let attributeValue = element.getAttribute(attributeName);Code language: JavaScript (javascript)

例えば、アンカー要素のtitle属性の値を取得するには、次のコードを使用します。

const link = document.querySelector('a');
let title = link.getAttribute('title');Code language: JavaScript (javascript)

getAttribute()メソッドを使用してdata-*属性を取得することも可能です。例えば

<a href="/api" data-method="post">Save</a>Code language: HTML, XML (xml)

アンカー要素のdata-method属性の値を取得するには、次のようにgetAttribute()メソッドを使用します。

const link = document.querySelector('a');
let method = link.getAttribute('data-method');Code language: JavaScript (javascript)