概要
与えられた要素の属性のコレクションを返します。
構文
varattrs =element.attributes;
返されるobjectは NamedNodeMap型で、Attr ノードを含んでいます。もし、その要素が定義された属性を持っていなければ、返されるオブジェクトのlengthは0(ゼロ)です。この属性は read-only です。
例
// ドキュメント内の最初の <p> 要素の取得
var para = document.getElementsByTagName("p")[0];
var atts = para.attributes;
注記
コレクションの要素には名前とインデックスによってアクセスすることができます。しかしNodeListと違って、NamedNodeMapではその要素は特定の順序で保持されないことに注意して下さい。
インデックスによるアクセスは、以下の例のように、elementの属性を列挙する場合にのみ利用するべきです。以下の例は文書中の"p1"要素のすべての属性の値を表示します。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"https://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Attributes example</title>
<script type="text/javascript">
function showFirstAttr()
{
var firstPara = document.getElementById("p1");
var outputText = document.getElementById("result");
// まず、最初の段落(p1)がなんらかの属性を持っているか確かめよう
if (firstPara.hasAttributes())
{
var attrs = firstPara.attributes;
var text = "";
for(var i=attrs.length-1; i>=0; i--) {
text += attrs[i].name + "->" + attrs[i].value;
}
outputText.value = text;
} else {
outputText.value = "No attributes to show"
};
}
</script>
</head>
<body>
<p id="p1" style="color: green;">Sample Paragraph</p>
<form action="">
<p><input type="button" value="Show first attribute name and value"
onclick="showFirstAttr();">
<input id="result" type="text" value=""></p>
</form>
</body>
</html>
NamedNodeMapは配列のように走査する機能は提供していますが、Arrayが提供しているjoinやsplitといった特殊なメソッドの幾つかは提供していません。
名前から特定の属性にアクセスするには、getAttributeメソッドを利用してください。