mozillaでxml domを使って画像を選択しhtml表示したくて、いろいろ調べ
The XSLT/JavaScript Interface In Geckoにあるとおりやってみました。
次のようなファイルをapache2 サーバーにおいてmozillaで開きます。
The XSLT/JavaScript Interface In Geckoにあるとおりやってみました。
次のようなファイルをapache2 サーバーにおいてmozillaで開きます。
<html>
<head>
<script type="text/javascript">
var xslStylesheet;
var xsltProcessor = new XSLTProcessor();
var myDOM;
var xmlDoc;
function init(){
//load the xslt file
var myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "first.xsl", false);
myXMLHTTPRequest.send(null);
xslStylesheet = myXMLHTTPRequest.responseXML;
xsltProcessor.importStylesheet(xslStylesheet);
// load the xml file
myXMLHTTPRequest = new XMLHttpRequest();
myXMLHTTPRequest.open("GET", "myimagefiles.xml", false);
myXMLHTTPRequest.send(null);
xmlDoc = myXMLHTTPRequest.responseXML;
var fragment = xsltProcessor.transformToFragment(xmlDoc, document);
document.getElementById("example").innerHTML="";
myDOM=fragment;
document.getElementById("example").appendChild(fragment);
}
</script>
</head>
<body onload="init()">
<div id="example">
</div>
</body>
</html>
first.xsl として以下のファイルを作成しました
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h3>My IMAGE Collection</h3>
<table border="0" width="100%">
<xsl:for-each select="album/image">
<xsl:if test="street='sumiyama' and publish=1 ">
<tr>
<td>
<img><xsl:attribute name="src"><xsl:value-of select="filename" /></xsl:attribute></img>
<p><xsl:value-of select="title" /></p>
</td>
</tr>
</xsl:if>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
xmlはこんな感じです
<?xml version="1.0" encoding="utf-8"?>
<album>
<image>
<description></description>
<people></people>
<object>plants</object>
<title>桔梗</title>
<filename>p1.jpg</filename>
<artist>seacormorant</artist>
<country>Japan</country>
<prefecture>Kyoto</prefecture>
<city>uji</city>
<street>sumiyama</street>
<date>2006-07-05</date>
<publish>1</publish>
</image>