XMLHttp でサーバーデータを取得


  XSLT を用いたデータの取り出し



XPath を用いたデータの取り出しは、XSLT を用いる事によって、より簡単に実現できます。
Mozilla では、selectNodes が使用できませんでしたが、同様の結果を得る事ができます

以下は、XSLT によって、1番目のコンボボックスのデータを取り出します。
( list[position()=1] )

sjis_combo.xsl
  
<?xml version="1.0" encoding="shift_jis" ?>
<xsl:stylesheet version="1.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="text" />

<xsl:template match="/">

	<xsl:value-of select="combodata/list[position()=1]" />

</xsl:template>

</xsl:stylesheet>
  
※ xsl:output は、IE の場合必要です

  
<HTML>
<HEAD>
<META http-equiv="content-type" content="text/html; charset=shift_jis">
<SCRIPT language="javascript" type="text/javascript">

	var dom,bIE;
	var objXMLHttp;

	if ( document.all ) {
		bIE = true;
		dom = new ActiveXObject("Msxml2.DOMDocument.3.0");
		objXMLHttp = new ActiveXObject("Msxml2.XMLHTTP.3.0");
	}
	else {
		bIE = false;
		dom = document.implementation.createDocument("", "", null);
		objXMLHttp = new XMLHttpRequest();
	}


function GetServerData( ) {

	var xml,xsl;

	// 最後のパラメータの false は、同期実行を意味します
	objXMLHttp.open(
		"GET",
		"sjis_combo.xml"
		, false );
	objXMLHttp.send( "" );
	xml = objXMLHttp.responseXML;

	objXMLHttp.open(
		"GET",
		"sjis_combo.xsl"
		, false );
	objXMLHttp.send( "" );
	xsl = objXMLHttp.responseXML;

	if ( document.all ) {
		document.getElementById("data").innerHTML
		= xml.transformNode( xsl.documentElement );
	}
	else {
		processor = new XSLTProcessor();
		processor.importStylesheet(xsl);

		newFragment = processor.transformToFragment(xml,document);
		document.getElementById("data").innerHTML
		= newFragment.childNodes.item(0).nodeValue;
	}

}

</SCRIPT>
</HEAD>
<BODY>

<INPUT type=button name="send" value="送信" onClick='GetServerData( )'>
<DIV id="data"></DIV>

</BODY>
</HTML>
  

上記処理では、HTML として コンボボックスが実装されますが、
これを テキストとして表示したい場合は以下のようにします

  
function GetServerData( ) {

	var xml,xsl,objNode;

	// 最後のパラメータの false は、同期実行を意味します
	objXMLHttp.open(
		"GET",
		"sjis_combo.xml"
		, false );
	objXMLHttp.send( "" );
	xml = objXMLHttp.responseXML;

	objXMLHttp.open(
		"GET",
		"sjis_combo.xsl"
		, false );
	objXMLHttp.send( "" );
	xsl = objXMLHttp.responseXML;

	if ( document.all ) {
		// このコメント2行を実行すると、HTML エンティティで表示されます
		document.getElementById("data").innerText
		= xml.transformNode( xsl.documentElement );
	}
	else {
		processor = new XSLTProcessor();
		processor.importStylesheet(xsl);

		newFragment = processor.transformToFragment(xml,document);
		document.getElementById("data").appendChild(newFragment);
	}

}
  

さらに IE では、以下のようにすると(2行を加える)エンティティ参照で表示されます

  
function GetServerData( ) {

	var xml,xsl,objNode;

	// 最後のパラメータの false は、同期実行を意味します
	objXMLHttp.open(
		"GET",
		"sjis_combo.xml"
		, false );
	objXMLHttp.send( "" );
	xml = objXMLHttp.responseXML;

	objXMLHttp.open(
		"GET",
		"sjis_combo.xsl"
		, false );
	objXMLHttp.send( "" );
	xsl = objXMLHttp.responseXML;

	if ( document.all ) {
		objNode = xsl.getElementsByTagName("xsl:output").item(0);
		objNode.attributes.getNamedItem("method").nodeValue = "html";
		document.getElementById("data").innerText
		= xml.transformNode( xsl.documentElement );
	}
	else {
		processor = new XSLTProcessor();
		processor.importStylesheet(xsl);

		newFragment = processor.transformToFragment(xml,document);
		document.getElementById("data").appendChild(newFragment);
	}

}
  










  infoboard   管理者用   
このエントリーをはてなブックマークに追加





フリーフォントWEBサービス
SQLの窓WEBサービス

SQLの窓フリーソフト

素材

一般WEBツールリンク

SQLの窓

フリーソフト

JSライブラリ