Document.createAttributeNS() - 名前空間を持つ属性ノードを作成する

2017/10/07

createAttributeNS()は、Documentのメソッドです。名前空間を持つ属性ノード(Attr)を新しく作成します。

概要

名前

createAttributeNS

所属

IDL

[NewObject] Attr createAttributeNS(DOMString? namespace, DOMString qualifiedName);

仕様書

https://dom.spec.whatwg.org/#dom-document-createattributens

説明

第1引数(namespace)には、名前空間URIを指定します。

第2引数(qualifiedName)には、属性名を指定します。

チュートリアル

名前空間を持つ属性ノードを作成する例です。

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
	<image width="50" height="50" id="hoge"/>
</svg>

// 属性を作成
var attr = document.createAttributeNS( "http://www.w3.org/1999/xlink", "href" ) ;	// xlink:href

// 値を代入
attr.value = "data:image/png;base64,..." ;	// xlink:href="data:image/png;base64,..."

// image要素に属性を追加
document.getElementById( "hoge" ).setAttributeNode( attr ) ;	// <image xlink:href="data:image/png;base64,...">

デモ

Document.createAttributeNS()のデモです。

<!-- このコードは編集できます。 -->

<!DOCTYPE html>
<html>
<body>
<script>
var attr = document.createAttributeNS( "http://www.w3.org/1999/xlink", "href" ) ;

console.log( attr ) ;
document.body.appendChild( new Text( attr ) ) ;
</script>
</body>
</html>