<xvcd:text-of>と<xvcd:value-of>の練習
上で<xvcd:text-of>、下で<xvcd:value-of>を使っている。上を変更すると、
下も連動してデータが変化する。上でデータを削除して空にすると、下でもデータが空になる。
【result view】
【xfy_sample0009.xml】
<?xml version="1.0"?>
<?com.xfy vocabulary-connection href="xfy_sample0009.xvcd" ?>
<m3:document xmlns:m3="http://www.makoto3.net/xfy">
<m3:person>
<m3:name>山田太郎</m3:name>
<m3:gender>男</m3:gender>
<m3:age>30</m3:age>
</m3:person>
</m3:document>
【xfy_sample0009.xvcd】
<?xml version="1.0"?>
<xvcd:xvcd
xmlns:xvcd="http://xmlns.xfy.com/xvcd"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:m3="http://www.makoto3.net/xfy"
version="1.0">
<xvcd:vocabulary name="xfy_sample" match="m3:document" call-template="root"/>
<xvcd:template name="root">
<html>
<head>
<title>HelloWorld example</title>
</head>
<body>
<h2>社員データ</h2>
<xvcd:apply-templates />
</body>
</html>
</xvcd:template>
<xvcd:template match="m3:person">
<p style="border:1px solid #ff0000;padding:10px;width:350px;">
<div>[編集エリア]</div>
<div>名前 : <xvcd:text-of select="m3:name"/></div>
<div>性別 : <xvcd:text-of select="m3:gender"/></div>
<div>年齢 : <xvcd:text-of select="m3:age"/></div>
</p>
<p style="border:1px solid #0000ff;padding:10px;width:350px;">
<div>[表示エリア]</div>
<div>名前 : <xvcd:value-of select="m3:name"/></div>
<div>性別 : <xvcd:value-of select="m3:gender"/></div>
<div>年齢 : <xvcd:value-of select="m3:age"/></div>
</p>
</xvcd:template>
</xvcd:xvcd>