Ext 的 XmlReader 測試

測試環境:
1. Windows XP Pro + SP2
2. IE 6.0
3. Javascript Library 
    3.1 Ext 1.0a 
    3.2 Prototype 1.5.0

Ext 1.0 提供了 XmlReader 物件,可將 XML Document 轉換成 Array,下面是一個簡單的測試範例,因為使用了 IE 專屬的 XMLDOM 所以此範例無法運作於 Firefox 中。如果 XML 是放在遠端機器上,可搭配 HttpProxy 物件使用,如此可同時用於 IE 和 Firefox。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> new document </title>
 <meta http-equiv="Content-Type" content="text/html; charset=big5"/>
 <meta name="author" content="Chui-Wen Chiu">
 <script type="text/javascript" src="../prototype.js"></script>
    <script type="text/javascript" src="../../yui-utilities.js"></script>     <script type="text/javascript" src="../../ext-yui-adapter.js"></script>     <!-- ENDLIBS -->
    <script type="text/javascript" src="../../ext-all-debug.js"></script>
 
<script type = 'text/javascript'>
<!--//
 Ext.onReady(function(){
  // 1. 產生 XmlReader
  // 下面的參數主要的意思是將 XML 中的 <Item> 標籤轉換成陣列
  // 陣列中的每一筆資料代表一筆紀錄,每一筆紀錄使用 <ASIN>xxx</ASIN> 為識別碼
  // 將 <Item> 標籤的數量放置在 totalRecords
  // 每一筆紀錄的欄位分別抓取 <Item> 標籤下的 <Author>, <Title>, <Manufacturer>, <ProductGroup> 等標籤

  var xr = new Ext.data.XmlReader({
       record: 'Item',   // XML 標籤
       id: 'ASIN',    // 紀錄識別碼對應 XML 的標籤
       totalRecords: '@total' // 取得 record 欄位指定標籤(<Item>)的數量,如果未指定該欄位,則 Record 物件的 totalRecords 屬性將直接取用 <item> 標籤數量,一般情況兩個值應該都一樣
      },
     // 要讀取的欄位定義
     [
      {
       name: 'Author',
       mapping: 'ItemAttributes > Author'
      },
      'Title',
      'Manufacturer',
      'ProductGroup'
     ]
      );
  // 2. 產生一個 XML Document
  var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
  var xmlStr = '/
  <?xml version="1.0" encoding="big5"?>/
    <Items>/
     <Item>/
      <ASIN>0446354732</ASIN>/
      <DetailPageURL>http://www.amazon.com/gp/</DetailPageURL>/
      <ItemAttributes>/
       <Author>中文作者</Author>/
       <Manufacturer>Warner Books</Manufacturer>/
       <ProductGroup>Book</ProductGroup>/
       <Title>Nothing Lasts Forever</Title>/
      </ItemAttributes>/
     </Item>/
    </Items>/
  ';
  xmlDoc.loadXML(xmlStr);

  // 3. 將 XML Document 轉換成 Array
  var rs = xr.readRecords(xmlDoc);

  // 4. 取得資料筆數
  var count = rs.totalRecords;
  $('lblCount').innerText = count;

  var out = '';
  for(var i = 0; i< count; ++i){
   // 5. 取得每一筆紀錄,型態為 Record 物件
   var r = rs.records[i]; 

   // Record 有兩個重要屬性
   // id: Item 的識別碼
   // data: 欄位陣列
   // 上述兩個屬性都依據 XmlReader 建構子的兩個參數所決定

   out += r.id + '=>' + [r.data['Author'], r.data['Title'] , r.data['Manufacturer'] , r.data['ProductGroup'] ].join(',') + '<br/>';
  }
  $('divRecord').innerHTML = out;

 });
//-->
</script>
</head>
<body>
<div>
 <label>Total:</label><label id = 'lblCount' style = 'color: red'></label>
 <div id ='divRecord'>
 </div>
</div>

</body>
</html>

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值