zoukankan      html  css  js  c++  java
  • XML在Web中的简单应用

    首先建立一个Area.html,很简单包含一个省份的select元素和一个城市的界面元素:

    <html>
    <head>
    <title>Area Demo</title>
    </head>
    <body>
    <select id="province" size=1 onchange="loadCity()">
    <option value="city01.xml">  江苏  </option>
    <option value="city02.xml">  º湖南 </option>
    <option value="city03.xml">  湖北  </option>
    </select>
    <select id="city" size=1>
    </select>
    <xml id="xmlobj"></xml>
    <script language="javascript" type="text/javascript">
    var provobj = document.all("province");
    var cityobj = document.all("city");
    var xmlhttp = document.all("xmlobj");
    loadCity();
    /**
     * 装载城市数据
     */
    function loadCity() {
     cityobj.options.length = 0;
     var file = provobj.options[provobj.selectedIndex].value;
     xmlhttp.async = false;
     xmlhttp.load(file);
     var cities = xmlhttp.selectNodes("Cities/City");
     var idx,name;

     for(idx = 0; idx < cities.length; idx ++) {
      name = cities[idx].getAttribute("name");
      cityobj.options.length++;
      cityobj.options[cityobj.options.length - 1].value = name;
      cityobj.options[cityobj.options.length - 1].text = name;
     }
    }
    </script>
    </body>
    </html>

    然后建立三个省份的城市数据文件,分别命名为city01.xml,city02.xml,city03.xml

    <?xml version="1.0" encoding="GB2312"?>
    <Cities Province="江苏">
     <City name="南京"/>
    </Cities>

    <?xml version="1.0" encoding="GB2312"?>
    <Cities Province="湖南">
     <City name="长沙"/>
    </Cities>

    <?xml version="1.0" encoding="GB2312"?>
    <Cities Province="湖北">
     <City name="武汉"/>
    </Cities>

    保存,在ie6浏览通过,理论上可以在ie5一上浏览器跑。

  • 相关阅读:
    不务正业系列-浅谈《过气堡垒》,一个RTS玩家的视角
    [LeetCode] 54. Spiral Matrix
    [LeetCode] 40. Combination Sum II
    138. Copy List with Random Pointer
    310. Minimum Height Trees
    4. Median of Two Sorted Arrays
    153. Find Minimum in Rotated Sorted Array
    33. Search in Rotated Sorted Array
    35. Search Insert Position
    278. First Bad Version
  • 原文地址:https://www.cnblogs.com/Dicky/p/133650.html
Copyright © 2011-2022 走看看