element.setAttributeNode( attributeObject )は、「element」に指定した要素に、引数「attributeObject」に指定した属性オブジェクトの属性を追加するメソッド。同じ属性名が存在する場合、その属性名の属性値を変更する。
構文
$elementNodeReference.setAttributeNode( attributeObject );
引数
- attributeObject
- 属性オブジェクト（Attrオブジェクト、Attrノード）を指定。
サンプル
■■■サンプル■■■
サンプルの動作について
「スタイル属性値を設定」ボタンをクリックすると、ボタンの右横の「■■■サンプル■■■」の文字色が赤色になる。
サンプルのソースコード
JavaScript
<script type="text/javascript">
function sample() {
var $attribute = document.createAttribute( "style" );
$attribute.nodeValue= "color: red;";
var $sample = document.getElementById( "sample" );
$sample.setAttributeNode( $attribute );
}
</script>
function sample() {
var $attribute = document.createAttribute( "style" );
$attribute.nodeValue= "color: red;";
var $sample = document.getElementById( "sample" );
$sample.setAttributeNode( $attribute );
}
</script>
HTML
<p id="sample" style="color: blue;">
<button onclick="sample();">スタイル属性値を設定</button>
■■■サンプル■■■
</p>
<button onclick="sample();">スタイル属性値を設定</button>
■■■サンプル■■■
</p>