XML

XML関係。

  • 空DOM生成・パース
    • あとでいいです
    • Java
    • PHP
    • javascript

子要素、子孫要素取得・生成・追加・削除

Java

Java Platform インタフェース Node
getChildNodesメソッドでNodeListとしてすべての子要素を取得してNodeListで作成。
以下DataStructureSampleMain.javaより
NodeList es = e.getChildNodes();
      for (int i=0; i<es.getLength(); i++) {
        Element child = (Element)es.item(i);
        printDIV(out, child);
      }
要素の生成createElementメソッド
Element htmlE = dstDoc.createElement("html");
要素の追加appendChildメソッド
dstDoc.appendChild(htmlE);
要素の削除removeChildメソッド
dstDoc.removeChild(linkE); //linkタグが除去される
  • 子孫要素の参照について
    • 再帰を使って表す方法
public static void printDIV(PrintStream out, Element e) {
    out.print("<div>");
    if (e.getTagName().equals("FILE")) {
      out.print(e.getAttribute("fileName"));
      out.print(" <span>(");
      out.print(e.getAttribute("lastModifiedDate"));
      out.print(")</span>");
    } else {
      out.print(e.getAttribute("directoryName"));
      out.print(" <span>(");
      out.print(e.getAttribute("lastModifiedDate"));
      out.print(")</span>");
      NodeList es = e.getChildNodes();
      for (int i=0; i<es.getLength(); i++) {
        Element child = (Element)es.item(i);
        printDIV(out, child); //自分自身のメソッドに子ノードのエレメントを取り出して渡している
      }
    }
    out.println("</div>");
  }
    • getElementByTagNameメソッド
指定したタグ名以下の全ての子孫要素をNodeListで返します。
「枝分かれ」があった場合は名前順に当たるのが早い順(文章順)に葉ノードまで参照して次へ向かう様です。
実行したサンプル
DataStructureSampleMain,javaの(DOM課題)appendDirectorysChildメソッド内部
NodeList sysoutList = document.getElementsByTagName("DIR");
    for(int i=0; i<sysoutList.getLength(); i++){
    	System.out.print(i);
    	System.out.println((Element)sysoutList.item(i));
    }
実行結果
2013年07月11日
0[DIR: null]
0[DIR: null]
1[DIR: null]
0[DIR: null]
1[DIR: null]
2[DIR: null]
0[DIR: null]
1[DIR: null]
2[DIR: null]

PHP

createElementメソッドによりxmlタグのような形で要素の作成が可能。
このメソッドに二つ目の要素を書くとテキストノードの様に処理される。
appendChildメソッドで要素の追加を行うことが出来る。
その他のメソッドの細かい説明はほかの項目で。
実行サンプル
<?php
$dom = new DOMDocument('1.0','UTF-8'); //ドキュメントを新しく作成
$element = $dom->createElement('test','This is the root element'); //新要素に属性を付与してテキストも追加
$dom->appendChild($element); //ドキュメントに子ノードを追加
echo $dom->saveXML(); //DOM表現からXMLドキュメントを作成
?>

javascript

※javascriptでのXMLのDOM化にはDHTMLが非常によく使われ、そのためほぼIEでしか起動できない状況です。
子要素を取るときはJavaやphp同様にすることが出来ます。

XML部分
<?xml version="1.0" encoding="shift_jis"?>
<会員データ>
<氏名>伸縮 次郎</氏名>
<住所>大阪</住所>
</会員データ>
HTML部分
<script language="JavaScript">
function Test(){
Docm = new ActiveXObject('microsoft.XMLDOM'); //この関数はIEにのみ対応しています。
Docm.async = false; //XMLの読み込み終了まで処理を待ちます。
Docm.load('samp01.xml'); 
var string ="";
string = "samp01.xmlルートノード名:"+Docm.documentElement.nodeName+"<br>"; //ルートノードを取る。
if(Docm.documentElement.hasChildNodes()) //子ノードを持っていたら
{
	var i = 0;
	var n_num = Docm.documentElement.childNodes.length; //ルートについている子ノードの数
	while(i < n_num){
	string += Docm.documentElement.childNodes.item(i).text += "  "; //子ノードのテキストを取る。
	i++;
	}
}
document.write(string);
}
</script>
参照:伸び縮みマークアップ言語-XML
これを応用して再帰処理を行うことで子孫要素を取得できます。
function LoopChilds(target){
  var childs=target.childNodes;
  if(childs.length != 0){
    for(var i=0;i<childs.length;i++){
	   result += childs(i).nodeName + "::" + childs(i).nodeValue+"<br>";
	   var nextChilds = childs(i).childNodes;
	   if(nextChilds.length != 0)LoopChilds(childs(i));
	 }
  }
  return result;
}
  • 子要素の生成、追加
JavascriptでXMLファイルを指定しなかった場合、htmlファイル自信を参照しようとします。
<script type="text/javascript">
function addElement() {  
    var element = document.createElement('div'); //要素を作成
    element.id = "id"; //idを使うことでエレメントをノードの様に扱うことが可能です。
    element.innerHTML = "hogehoge"; //コメント部分を記入
    element.style.backgroundColor = 'red'; //背景を指定
    var objBody = document.getElementsByTagName("body").item(0); //「body」と付いた最初のタグを指します
    objBody.appendChild(element); //指定したノードに要素を追加します。
    // body要素にdivエレメントを追加
}
</script>
<button onclick="addElement()">要素を追加</button> <!-- <div id="id">hogehoge</div> がhtml上出力 -->
  • 子要素の削除
element.removeChildメソッドを使用します。
※getElementsByTagNameからの指定はできないようです…
function removeElement(){
  var element = document.getElementById("id");
  element.removeChild(element.childNodes.item(0));
}
//<button onclick="removeElement()">要素を削除</button>などつけて実行

親要素追加

ドキュメントの作成についてここに記述しておきます。

Java

ドキュメント作成
DocumentBuilderFactory dbfFactory = DocumentBuilderFactory.newInstance();
DocumentBuilder docbuilder = dbfFactory.newDocumentBuilder();
Document document = docbuilder.newDocument();
  • これらのクラスはスレッド一つあたり一つのインスタンスになることが推奨されています。

    • PHP
    • javascript

属性取得・更新・削除

Java

属性の追加を行うにはsetAttributeメソッド
Element link = document.createElement("link");
link.setAttribute("rel", "stylesheet");
link.setAttribute("type", "text/css");
link.setAttribute("href", "divTestCss.css");
head.appendChild(link);
属性の削除を行うにはremoveAttributeメソッド
another.setAttribute("lastModifiedDate", sdf1.format(new Date(files1[j].lastModified())));
//another.removeAttribute("lastModifiedDate");
属性の取得を行うにはgetAttributeメソッド
out.print(e.getAttribute("fileName"));

PHP

  • 属性の追加と習得
createAttributeメソッドとvalue指定を行える。
しかしsetAttributeも使えるのでこちらを使ったほうが早い。
 $domElement = $domDocument->createElement('div','dirName');
$domAttribute = $domDocument->createAttribute('day'); //属性名のみ作成
$domAttribute->value = 'daypass'; //属性値を設定
$domElement->setAttribute("align","left"); //属性値と属性名を設定。
$domElement->appendChild($domAttribute);

$domDocument->appendChild($domElement);
  • 属性の削除
removeAttributeメソッド
更新は一旦削除して追加
$domElement->setAttribute("align","left");
$domElement->removeAttribute("align");
属性の確認はhasAttributeメソッドで行う
PHP Manual

javascript

<a id="sample" rel="test">sampleLink</a><br>
<script type="text/javascript">
function findElement(){
  var element = document.getElementById("sample");
  element.removeAttribute("rel"); //属性を削除する
  alert("a タグの rel 属性:"+element.getAttribute("rel"));
}

function findElement2(){
  var element = document.getElementById("sample");
  element.setAttribute("rel","hoge"); //属性の値を設定する
  alert("a タグの rel 属性:"+element.getAttribute("rel"));
}
</script>
<button onclick="findElement()">aタグの属性を削除</button>
<button onclick="findElement2()">aタグの属性をhogeに</button>

文字列データ取得・生成・追加・削除


Java

文字列をxmlタグ内に出力を行うにはcreateTextNodeメソッド
divE.appendChild(dstDoc.createTextNode(e.getAttribute("fileName") + " "));
    • PHP
    • javascript

その他

Java

  • 要素の削除、追加についてTextノード以外にも応用できる方法
removeChildメソッドとreplaceChildメソッド
Element body = document.createElement("body");
root.appendChild(body);
body.appendChild(document.createTextNode("本文"));
			
Element bulk = document.createElement("使わない");
body.appendChild(bulk);
//body.removeChild(bulk); //bulk要素を削除するスレッド
		
Element dir = document.createElement("div");
dir.appendChild(document.createTextNode("dirxxx"));
body.replaceChild(dir, bulk); //bulk要素とdir要素を交換

PHP

メモの様な

PHPで実行できたサンプル
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 <html>
 <head>
 <meta http-equiv="content-type" content="text/html;charset=shift_jis">
 <title>Sample</title>
 <script type="text/javascript"><!--
function create() {
 var divObj = document.getElementById("pBox");
 var tNode = document.createTextNode("Sample "); //テキストノードの作成
 divObj.appendChild(tNode); //(テキスト)ノードの追加
 }
 // --></script>
 </head>
 <body bgcolor="#fffff0">
 <h1>createTextNode</h1>
 <form>
 <input type="button" id="myButton" value="Click" onClick="create()">
 </form>
 <div id="pBox"></div>
 </body>
 </html>

タグ:

+ タグ編集
  • タグ:

このサイトはreCAPTCHAによって保護されており、Googleの プライバシーポリシー利用規約 が適用されます。

最終更新:2013年12月17日 14:36