ホームページ > 記事 > ウェブフロントエンド > jQueryによるXMLファイルの解析の詳細説明
今回は、jQuery による XML ファイルの解析について詳しく説明します。jQuery による XML ファイルの解析に関する 注意事項 について、実際の事例を見てみましょう。
<html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>jquery xml解析</title> <script src="jquery.min.js" type="text/ javascript "></script> <script type="text/javascript"> $( document ).ready(function(){ $.ajax({url:"City.xml", success:function(xml){ $(xml).find("province").each(function(){ var t = $(this).attr("name");//this-> $("#DropProvince").append("<option>"+t+"</option>"); }); } }); $("#DropProvince").change(function(){ $("#sCity>option").remove(); var pname = $("#DropProvince").val(); $.ajax({url:"City.xml", success:function(xml){ $(xml).find("province[name='"+pname+"']>city").each(function(){ $("#sCity").append("<option>"+$(this).text()+"</option>"); }); } }); }); }); </script> </head> <body> <form id="form1"> <p> <select id="DropProvince" style="width:60px;"> <option>请选择</option> </select> <select id="sCity" style="width:60px;"> </select> </p> </form> </body> </html>
city.xml ファイル
<?xml version="1.0" encoding="utf-8" ?> <provinces> <province name="湖北"> <city>武汉</city> <city>黄石</city> <city>宜昌</city> <city>天门</city> </province> <province name="湖南"> <city>邵阳</city> <city>长沙</city> <city>岳阳</city> </province> <province name="广东"> <city>广州</city> <city>深圳</city> </province> </provinces>
実際、主なことは、HTML インターフェースで XML ファイルを解析する方法に注意を払うことです。形式は
<script type="text/javascript"> $(document).ready(function () { $.ajax({ url: "City.xml", success: function (xml) { $(xml).find("province").each(function () { var t = $(this).attr("name"); $("#DropProvince").append("<option>" + t + "</option>"); }); } }); $("#DropProvince").change(function () { $("#sCity>option").remove(); var pname = $("#DropProvince").val(); $.ajax({ url: "City.xml", success: function (xml) { $(xml).find("province[name='"+pname+"']>city").each(function(){ $("#sCity").append("<option>"+$(this).text()+"</option>"); }); } }); }); }); </script>
であり、これは $.ajax( ) XML ファイルの内容を呼び出します。その後、$.each() がループ操作を実行します。基本的な考え方は、成功後に成功コールバック関数を実行するというものです。ここでの xml ファイルはデータを保存するために使用され、これはデータベース内のファイル を読み取ることと同等です。 この記事の事例を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。
推奨読書:ファイルアップロード手順のJquery+LigerUI実装の詳細な説明
以上がjQueryによるXMLファイルの解析の詳細説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。