J.J.'s Blogs

J.J. Huang   2022-11-11   XML 1.基本教學   瀏覽次數：次   {{moment(1668128400000).fromNow()}}

XML教學 | 顯示

📑 目錄
  1. 顯示XML文件
    1. 格式良的XML顯示
    2. 錯誤的XML顯示
    3. XML為何顯示這樣子？
    4. 其他XML範例
  2. 結語

XML教學 - 圖 1 (1871431 online open shop shopping sign icon) 顯示XML文件

XML文件中包含了許多的元素，XML格式的訊息和其他標記的基本單元，以及各種各樣的資料。
以下將對如何對XML文件進行顯示做個簡單的介紹。

開始前記得 -

  • 在所有主流的瀏覽器中，均能夠顯示原始的XML文件。
  • 不要指望XML文件會直接顯示為HTML頁面。

XML教學 - 圖 2 (2620520 employee graduate job seeker unemployee icon) 格式良的XML顯示

XML原始碼的範例：​‌‌‌‌​​​​‌‌​‌‌​‌​‌‌​‌‌​​​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​‌​​​‌‌​​‌​​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌​‌‌​‌​‌​‌‌​​​​‌​​‌‌​‌​‌​​‌‌​​​​‌​‌‌​‌​​‌‌‌​​​

1
2
3
4
5
6
7
<?xml version="1.0" encoding="UTF-8"?>
<note>
  <to>Tove</to>
  <from>Jani</from>
  <heading>Reminder</heading>
  <body>Don't forget me this weekend!</body>
</note>

擷取於：w3schools View a simple XML file (note.xml)

XML教學 - 圖 3 (01)

可見上面動態圖的操作。​‌‌‌‌​​​​‌‌​‌‌​‌​‌‌​‌‌​​​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​‌​​​‌‌​​‌​​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌​‌‌​‌​‌​‌‌​​​​‌​​‌‌​‌​‌​​‌‌​​​​‌​‌‌​‌​​‌‌‌​​​

XML文件會透過顏色明顯化根元素與子元素。
通過點擊元素左側的符號可以做展開和收起元素的結構。
要顯示原始的XML，可以透過右鍵並選擇「檢視網頁原始碼」。

XML教學 - 圖 4 (2620530 check employee job seeker unemployee icon) 錯誤的XML顯示

開啟一個錯誤的XML文件，瀏覽器會報告錯誤。

XML原始碼的範例：​‌‌‌‌​​​​‌‌​‌‌​‌​‌‌​‌‌​​​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​‌​​​‌‌​​‌​​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌​‌‌​‌​‌​‌‌​​​​‌​​‌‌​‌​‌​​‌‌​​​​‌​‌‌​‌​​‌‌‌​​​

1
2
3
4
5
6
7
<?xml version="1.0" encoding="UTF-8"?>
<note>
  <to>Tove</to>
  <From>Jani</from>
  <heading>Reminder</heading>
  <body>Don't forget me this weekend!</body>
</note>

請點擊顯示這個note_error.xml檔案，將會顯示如下圖的錯誤訊息。

XML教學 - 圖 5 (02)

XML教學 - 圖 6 (2064497 atom education learn school student icon) XML為何顯示這樣子？

  • XML文件不會攜帶有關如何顯示資料的訊息。
  • XML標籤由XML的作者「發明」，瀏覽器無法確定像<table>這樣一個標籤究竟描述一個HTML表格還是一張「桌子」。
  • 在沒有任何有關如何顯示資料的訊息的情況，大多數的瀏覽器都會僅僅把XML顯示為原始碼。

註：雖然主流瀏覽器都能夠支持XML的顯示，但是不同的瀏覽器處理XML的方式各不相同。​‌‌‌‌​​​​‌‌​‌‌​‌​‌‌​‌‌​​​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​‌​​​‌‌​​‌​​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌​‌‌​‌​‌​‌‌​​​​‌​​‌‌​‌​‌​​‌‌​​​​‌​‌‌​‌​​‌‌‌​​​

XML教學 - 圖 7 (2570321 business checklist company economic finance icon) 其他XML範例

請打開以下這些XML，這會有助於對XML的認識。

  • 一個XML的CD目錄：
    CD集，儲存為XML資料

  • 一個XML的植物目錄：
    植物店的植物目錄，儲存為XML資料​‌‌‌‌​​​​‌‌​‌‌​‌​‌‌​‌‌​​​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​‌​​​‌‌​​‌​​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌​‌‌​‌​‌​‌‌​​​​‌​​‌‌​‌​‌​​‌‌​​​​‌​‌‌​‌​​‌‌‌​​​

  • 一個XML的食物菜單：
    早餐店的早餐菜單，儲存為XML資料

XML教學 - 圖 8 (1871435 closed online shop shopping sign icon) 結語

至此基礎XML的教學基本上已經完結了。後面會再繼續針對相對進階的內容進行學習。

註：如果是為了解私服內所使用的XML而來學習的，那基本上到此已經足夠對結構「分析」了。​‌‌‌‌​​​​‌‌​‌‌​‌​‌‌​‌‌​​​​‌​‌‌​‌​​‌‌​​‌​​​‌‌​​​​​​‌‌​​‌​​​‌‌​​‌​​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌‌​​​‌​​‌​‌‌​‌​‌​‌‌​​​​‌​​‌‌​‌​‌​​‌‌​​​​‌​‌‌​‌​​‌‌‌​​​


註：以上參考了
w3resource.com - Displaying XML
RUNOOB.COM - XML 查看
維基百科-XML
Family with 220 icons by inipagi

📚 相關文章

📄 公開段落採 CC BY 3.0 TW 授權，可自由轉載引用，需署名出處。
🔒 付費 / 會員段落 © J.J. Huang，保留所有權利，禁止轉載。