XMLデータアイランドとDomによるアドレス帳作成のコード例を詳しく解説-XML/RSS チュートリアル-php.cn

一般に、Web サイトにアドレス帳プログラムを提供したい場合は、CGI とバックグラウンドデータベーステクノロジを組み合わせて使用する必要があり、これは WEB サーバーでの要件が比較的高く、データベースを提供しない多くの仮想ホストでは実装することさえできません。機能。もちろん、TXTテキストを使用してデータベースを置き換えることもできますが、TXTテキストは操作が難しく、1行ずつ読んで判断する必要があり、フィールドを区切る文字列を使用する必要があり、複雑な操作は実行できません。
「Extensible Markup Language (xml)」を使用してアドレス帳データを保存できるようになりました。これにより、XML の利点が反映されます。XML はデータを表現するための構造化された方法であり、多くのリレーショナルデータ構造を含むファイルを保存するのに非常に役立ちます。

1. 基本原則: Microsoft Internet Explorer 5.0 以降のバージョンでは、XML 要素を使用してデータアイランドを作成できます。XML データは HTML ページに含めることができます。 XML データアイランドを使用すると、複雑なスクリプトを記述する手間を省くことができます。 DOM は XML ドキュメントを解析でき、ドキュメント内のすべての要素、エンティティ、属性などをオブジェクトモデルで表現できます。生成されたオブジェクトモデルはツリーのノードとなります。各オブジェクトには、メソッドと属性に加えて、DOM にはノードを検索するための多くのメソッドが含まれています。 DOM を使用すると、開発者は動的に XML を作成し、ドキュメントを走査し、ドキュメントのコンテンツを追加 (削除/変更) することができます。DOM によって提供される API はプログラミング言語とは何の関係もないため、一部の DOM 標準および実装には明確に定義されたインターフェイスがありません。異なるパーサーのメソッドは異なる場合があります。

2. 具体的なプロセスは次のとおりです:

1. XML ファイルを次のように定義します:

<?xml version="1.0" encoding="gb2312"?> 
　　　　<中国计算机世界出版服务公司通信录> 
　　　　　　<计算机世界 contactID="2"> 
　　　　　　　　<部门名称>计算机室</部门名称> 
　　　　　　　　<电话号码>139</电话号码> 
　　　　　　　　<电子邮件>fsdos@163.net</电子邮件> 
　　　　　　</计算机世界> 
　　　　</中国计算机世界出版服务公司通信录>

ログイン後にコピー

上記の XML ドキュメントを tele.xml ファイルとして保存し、同時に上記の XML ドキュメントのフィールドの内容を空白のままにします。初期化フレームデータとして、 newid.xml ファイルとして保存します。

2. クライアントは XML ドキュメントをロードし、アドレス帳が配置されているテーブルの DATASRC='#xmldso' を介して XML ファイルをテーブルにバインドします。DATASRC 属性は、実際には XML 要素の ID 属性の前に追加されます。 # は上で実装されているため、TD 要素の中央に表示する必要がある特定のフィールドを指定できます。
３. DOM テクノロジーを使用して、アドレス帳にレコードを追加および削除します。 xmlhttp プロトコル経由でサーバーに接続し、XML ドキュメントを保存します。

3. XML DOM プログラミングの簡単な説明:

1. クライアント dom.htm ページ:

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<XML id=newid></XML> <!--加载xml数据--> 
<SCRipT Language=javaScript> 
newid.async = false; 
newid.load("newid.xml"); 
//增加记录； 
function addID(){ 
var doc=xmldso.XMLDocument 
var rootnode=doc.documentElement 
var sortNode = rootnode.selectNodes("//部门名称") 
var currentid = sortNode.length-1 
var cc=sortNode.item(currentid).text; 
if ((cc=="尚未输入")||(cc=="")) 
{ 
alert("请将最后一行数据填写完毕后再增加新的记录！"); 
} 
else 
{  
var node= newid.documentElement.childNodes(0).cloneNode(true); 
var contactID=parseInt(sortNode.item(currentid).parentNode.getAttribute("contactID"))+1;  
node.setAttribute("contactID",contactID);  
xmldso.documentElement.appendChild(node); 
} 
} 
//删除记录 
function delID(whichFld){ 
var sortNode = xmldso.selectSingleNode("//计算机世界[@contactID=&#39;"+whichFld+"&#39;]"); 
if (sortNode.parentNode.childNodes.length>1) sortNode.parentNode.removeChild(sortNode);  
} 
</SCRIPT> 
<script language="vbscript"> 
Sub cc_onmouseup &#39;保存记录； 
Dim objXML, objXSL, objfso,strFile, strFileName, strXSL,strURL,TheForm 
set SaveXMLDoc=xmldso.XMLDocument 
strURL="dns2.asp" 
Set objXML = CreateObject("Microsoft.XMLHTTP") &#39;创建MS的XMLHTTP组件； 
objXML.Open "post",strURL,false &#39;采用Post提交方式； 
objXML.setrequestheader "content-type","application/x-www-form-urlencoded" 
objXML.send SaveXMLDoc &#39; 发送信息，保存XML数据； 
&#39;xmlGet = objXML.responsebody &#39;稍等片刻后，得到服务器端传回来的结果； 
msgbox "保存成功！"  
Set objXML = Nothing 
end sub  
</SCRIPT> 
<center><b>计算机世界----通信录</b><br><br> 
<TABLE id="table" DATASRC=&#39;#xmldso&#39; BORDER CELLPADDING=3> 
<!--进行数据绑定--> 
<THEAD><TH>编号</TH><TH>部门名称</TH><TH>电话号码</TH><TH>电子邮件</TH></THEAD> 
<TR> 
<TD><acronym title=&#39;点击即可删除该记录&#39;><INPUT TYPE=button size=4 DATAFLD="contactID" onclick="delID(this.value)"></acronym></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="部门名称"></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="电话号码"></TD>  
<TD><INPUT TYPE=TEXT DATAFLD="电子邮件"></TD> 
</TR> 
</TABLE> 
<INPUT TYPE=BUTTON name=dd id=dd VALUE="增加记录" onmouSEOver="this.focus()" onmousedown="addID();"> 
<INPUT TYPE=BUTTON name=cc id=cc VALUE="保存"></center></BODY></HTML>

ログイン後にコピー

2. XML データを受信した後、ファイルオブジェクトを作成して Tele に保存します。 .xml 以上です:

< 
Set ReceivedDoc = CreateObject("Microsoft.XMLDOM") &#39;创建 XML DOM实例； 
ReceivedDoc.async=False 
ReceivedDoc.load Request &#39;接收XML数据； 
Set files=Server.CreateObject("Scripting.FileSystemObject") 
Set numtxt=files.CreateTextFile(Server.MapPath("tele.xml"),True) 
numtxt.WriteLine(replace(ReceivedDoc.xml,"?>"," encoding=""gb2312""?>")) &#39;将XML数据写入文件 
numtxt.Close 
response.write ReceivedDoc.xml 
>

ログイン後にコピー

３. 実際の使用プロセスでは、アドレス帳を表示する Web ページのindex.htm も追加する必要があります。これは、実際には上記の dom.htm の追加をすべて削除した簡素化されたバージョンです。フォーム内のみで関数の削除、変更、保存が可能です。 LABEL を使用してセル内のデータを表示します:

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<center><b>计算机世界----通信录</b><br><br> 
<TABLE id="table" DATASRC=&#39;#xmldso&#39; BORDER CELLPADDING=3> 
<THEAD><TH>编号</TH><TH>部门名称</TH><TH>电话号码</TH><TH>电子邮件</TH> 
</THEAD> 
<TR> 
<TD><label DATAFLD="contactID"></label></TD> 
<TD><label DATAFLD="部门名称"></label></TD> 
<TD><label DATAFLD="电话号码"></label></TD>  
<TD><label DATAFLD="电子邮件"></label></TD> 
</TR> 
</TABLE> 
</center></BODY></HTML>

ログイン後にコピー

4. XML データアイランドを Dom テクノロジーと組み合わせて使用する利点: まず第一に、もちろん、それはもたらされる利点です。 XML 自体によって。 XML は、タグ定義の独占を打ち破ります。この記事で使用されている XML ファイルでは、データに含まれる情報が説明されていないため、フィールド名も非常にシンプルかつ明確になります。ディスプレイ上の説明ですが、これは情報の意味論的な意味であり、文書の読みやすさを大幅に高めます。 XML を使用すると、異なるシステム間での情報の転送も容易になります。

2. XML データアイランドを使用すると、ユーザーはサーバーと頻繁にやり取りすることなく、クライアント上のデータセットにアクセスして操作できるため、サーバーの負荷を軽減するのに非常に役立ちます。同時に、XML データアイランド自体の特性により、クライアントでのデータ操作が非常に簡単になり、プログラミングの量が削減されます。

３. DOM は XML 文書内の情報にアクセスするためにツリーモデルの使用を強制します。XML は本質的に階層構造であるため、この記述方法は非常に効果的です。 DOM インターフェイスを介して、アプリケーションはいつでも XML ドキュメント内のデータの任意の部分にアクセスでき、制御は非常に柔軟です。
４. xmlhttp オブジェクトを使用して XML データをサーバーに送信すると、クライアントページがちらつくことなく更新されます。

このプログラムは、Windows 2000 プラットフォームに基づいた IIS5.0 および IE5.0 で正常に実行されます。実際の申請プロセスでは、DOMとXSL技術を組み合わせて、XMLデータアイランドのdatapagesize属性やPReviousPage関数、nextPage関数を利用してアドレス帳にソート、フォーマット変換、データ検索などの機能を追加することもできます。 DTD と XML スキーマを使用してアドレス帳データを動的に検証します。

---------------------------終わり----------------------

添付: (すべてのソースプログラム)

*************************************** ** **********************************

1.index.htm (アドレス帳の表示):

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<center><b>计算机世界----通迅录</b><br><br> 
<TABLE id="table" DATASRC=&#39;#xmldso&#39; BORDER CELLPADDING=3> 
<THEAD><TH>编号</TH><TH>部门名称</TH><TH>电话号码</TH><TH>电子邮件</TH> 
</THEAD> 
<TR> 
<TD><label DATAFLD="contactID"></label></TD> 
<TD><label DATAFLD="部门名称"></label></TD> 
<TD><label DATAFLD="电话号码"></label></TD>  
<TD><label DATAFLD="电子邮件"></label></TD> 
</TR> 
</TABLE> 
</center></BODY></HTML>

ログイン後にコピー

************************************************ ***** ***************************

2. dom.htm (オンラインでアドレス帳を編集):

<HTML><BODY bgColor=#a1bae6> 
<XML id=xmldso src="tele.xml"></XML> 
<XML id=newid></XML> 
<SCRIPT Language=Javascript> 
newid.async = false; 
newid.load("newid.xml"); 
function addID(){ 
var doc=xmldso.XMLDocument 
var rootnode=doc.documentElement 
var sortNode = rootnode.selectNodes("//部门名称") 
var currentid = sortNode.length-1 
var cc=sortNode.item(currentid).text; 
if ((cc=="尚未输入")||(cc=="")) 
{ 
alert("请将最后一行数据填写完毕后再增加新的记录！"); 
} 
else 
{  
var node= newid.documentElement.childNodes(0).cloneNode(true); 
var contactID=parseInt(sortNode.item(currentid).parentNode.getAttribute("contactID"))+1;  
node.setAttribute("contactID",contactID);  
xmldso.documentElement.appendChild(node); 
} 
} 
function delID(whichFld){ 
var sortNode = xmldso.selectSingleNode("//计算机世界[@contactID=&#39;"+whichFld+"&#39;]"); 
if (sortNode.parentNode.childNodes.length>1) sortNode.parentNode.removeChild(sortNode);  
} 
</SCRIPT> 
<script language="vbscript"> 
Sub cc_onmouseup &#39;当点击“保存”按钮时触发； 
Dim objXML, objXSL, objFSO,strFile, strFileName, strXSL,strURL,TheForm 
set SaveXMLDoc=xmldso.XMLDocument 
strURL="dns2.asp" 
Set objXML = CreateObject("Microsoft.XMLHTTP") &#39;创建MS的XMLHTTP组件； 
objXML.Open "post",strURL,false &#39;采用Post提交方式； 
objXML.setrequestheader "content-type","application/x-www-form-urlencoded" 
objXML.send SaveXMLDoc &#39; 发送信息 
&#39;xmlGet = objXML.responsebody &#39;稍等片刻后，得到服务器端传回来的结果； 
msgbox "保存成功！"  
Set objXML = Nothing 
end sub  
</SCRIPT> 
<center><b>计算机世界----通信录</b><br><br> 
<TABLE id="table" DATASRC=&#39;#xmldso&#39; BORDER CELLPADDING=3> 
<THEAD> 
<TH>编号</TH> 
<TH>部门名称</TH> 
<TH>电话号码</TH> 
<TH>电子邮件</TH> 
</THEAD> 
<TR> 
<TD><acronym title=&#39;点击即可删除该记录&#39;><INPUT TYPE=button size=4 DATAFLD="contactID" onclick="delID(this.value)"></acronym></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="部门名称"></TD> 
<TD><INPUT TYPE=TEXT DATAFLD="电话号码"></TD>  
<TD><INPUT TYPE=TEXT DATAFLD="电子邮件"></TD> 
</TR> 
</TABLE> 
<INPUT TYPE=BUTTON name=dd id=dd VALUE="增加记录" onmouseover="this.focus()" onmousedown="addID();"> 
<INPUT TYPE=BUTTON name=cc id=cc VALUE="保存"></center></BODY></HTML>

ログイン後にコピー

* ***** ******************************************** ****** ************************

3. dns2.asp (バックグラウンドでアドレス帳を保存):

<% 
Set ReceivedDoc = CreateObject("Microsoft.XMLDOM") 
ReceivedDoc.async=False 
ReceivedDoc.load Request 
Set files=Server.CreateObject("Scripting.FileSystemObject") 
Set numtxt=files.CreateTextFile(Server.MapPath("tele.xml"),True) 
numtxt.WriteLine(replace(ReceivedDoc.xml,"?>"," encoding=""gb2312""?>")) 
numtxt.Close 
response.write ReceivedDoc.xml 
%>

ログイン後にコピー

* *************** ********************************** **************** *************

4. tele.xml (アドレス帳 XML ドキュメント):

<?xml version="1.0" encoding="gb2312"?> 
<中国计算机世界出版服务公司通信录> 
<计算机世界 contactID="1"> 
<部门名称>电话总机</部门名称> 
<电话号码>010-68130909</电话号码> 
<电子邮件>webmaster@ccw.com.cn</电子邮件> 
</计算机世界> 
</中国计算机世界出版服务公司通信录>

ログイン後にコピー

****************************************************************************

五、newid.xml（通讯录XML初始化文档）：

<?xml version="1.0" encoding="gb2312"?> 
<中国计算机世界出版服务公司通信录> 
<计算机世界 contactID="1"> 
<部门名称>尚未输入</部门名称> 
<电话号码>保密</电话号码> 
<电子邮件>保密</电子邮件> 
</计算机世界> 
</中国计算机世界出版服务公司通信录>

ログイン後にコピー

以上就是用XML数据岛结合Dom制作通讯录的代码实例详解的内容，更多相关内容请关注PHP中文网（www.php.cn）！

php实现在线通讯录功能（附源码），通讯录源码

详解HTML5通讯录获取指定多个人的信息的示例代码

js实现做通讯录的索引滑动显示效果和滑动显示锚点效果