2. 程式人生 > >網頁中顯示XML

網頁中顯示XML

阿新 • • 發佈：2019-01-14

第一種方法

使用<pre></pre>包圍程式碼（在瀏覽器中測試不行啊，但是在富編輯器中又可以，怪）；
使用<xmp></xmp>包圍程式碼（官方不推薦，但是效果不錯哦，在firefox和IE都可以）；
使用<textarea></textarea>包圍程式碼（在富編輯器和瀏覽器中均可以 ）；

<pre>不能在頁面顯示；<xmp>不錯，可行；<textarea>是在文字域中顯示，達不到想要的效果。

<xmp>
    <div>對html的用法作個說明</div>
    <div><span id="demo">奇蹟</span></div>
</xmp>

如果想在網頁中顯示xml的完整結構，直接輸出，IE會把xml結構誤認為html的結構，普通的顯示只能顯示所有節點上的值，如果想顯示整個結果，可以在xml的兩端加上標籤 <xmp>xml結構</xmp> 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<html>  
<head>  
<title> New Document </title>  
<meta name="Generator" content="EditPlus">  
<meta name="Author" content="">  
<meta name="Keywords" content="">  
<meta name="Description" content="">  
</head>  

<body>  
<xmp>  
<?xml version="1.0" encoding="unicode"?>  
<DATABASE>  
    <SCHOOL-INFO>  
        <ID>1</ID>  
        <NAME>第一高中</NAME>  
        <CITY>浠水</CITY>  
        <STUDENTS>550</STUDENTS>  
        <ADDRESS>浠水</ADDRESS>  
    </SCHOOL-INFO>  
    <SCHOOL-INFO>  
        <ID>2</ID>  
        <NAME>第三高中</NAME>  
        <CITY>團陂</CITY>  
        <STUDENTS>1000</STUDENTS>  
        <ADDRESS>地址團陂</ADDRESS>  
    </SCHOOL-INFO>  
    <SCHOOL-INFO>  
        <ID>3</ID>  
        <NAME>試驗高中</NAME>  
        <CITY>1200</CITY>  
        <STUDENTS>1200</STUDENTS>  
        <ADDRESS>汪崗</ADDRESS>  
    </SCHOOL-INFO>  
    <SCHOOL-INFO>  
        <ID>4</ID>  
        <NAME>中心小學</NAME>  
        <CITY>1300</CITY>  
        <STUDENTS>1200</STUDENTS>  
        <ADDRESS>竹瓦</ADDRESS>  
	</SCHOOL-INFO>  
</DATABASE>  
</xmp>  
</body>  
</html>

第二種方法

“<”用&lt;表示
“>”用&gt;表示
“"”用&quot;表示

也可以在後臺處理好直接輸出到頁面上，程式碼顯示如下

<?xml version="1.0" encoding="unicode"?>     
&lt;DATABASE&gt;     
    &lt;SCHOOL-INFO&gt;     
        &lt;ID&gt;1&lt;/ID&gt;     
        &lt;NAME&gt;第一高中&lt;/NAME&gt;     
        &lt;CITY&gt;浠水&lt;/CITY&gt;     
        &lt;STUDENTS&gt;550&lt;/STUDENTS&gt;     
        &lt;ADDRESS&gt;浠水&lt;/ADDRESS&gt;     
    &lt;/SCHOOL-INFO&gt;     
    &lt;SCHOOL-INFO&gt;     
        &lt;ID&gt;2&lt;/ID&gt;     
        &lt;NAME&gt;第三高中&lt;/NAME&gt;     
        &lt;CITY&gt;團陂&lt;/CITY&gt;     
        &lt;STUDENTS&gt;1000&lt;/STUDENTS&gt;     
        &lt;ADDRESS&gt;地址團陂&lt;/ADDRESS&gt;     
    &lt;/SCHOOL-INFO&gt;     
    &lt;SCHOOL-INFO&gt;     
        &lt;ID&gt;3&lt;/ID&gt;     
        &lt;NAME&gt;試驗高中&lt;/NAME&gt;     
        &lt;CITY&gt;1200&lt;/CITY&gt;     
        &lt;STUDENTS&gt;1200&lt;/STUDENTS&gt;     
        &lt;ADDRESS&gt;汪崗&lt;/ADDRESS&gt;     
    &lt;/SCHOOL-INFO&gt;     
    &lt;SCHOOL-INFO&gt;     
        &lt;ID&gt;4&lt;/ID&gt;     
        &lt;NAME&gt;中心小學&lt;/NAME&gt;     
        &lt;CITY&gt;1300&lt;/CITY&gt;     
        &lt;STUDENTS&gt;1200&lt;/STUDENTS&gt;     
        &lt;ADDRESS&gt;竹瓦&lt;/ADDRESS&gt;     
    &lt;/SCHOOL-INFO&gt;     
&lt;/DATABASE&gt;     


這樣就可以顯示完整的xml資訊了。

轉載：http://www.cnblogs.com/skyme/archive/2010/11/10/1873296.html

我使用的是第二種方法，不知什麼原因第一種方法沒用。

相關推薦

網頁中顯示XML

第一種方法 使用<pre></pre>包圍程式碼（在瀏覽器中測試不行啊，但是在富編輯器中又可以，怪）； 使用<xmp></xmp>包圍程式碼（官方不推薦，但是效果不錯哦，在firefox和IE都可以）； 使用<te

怎樣把報表放到網頁中顯示（Web頁面與報表簡單集成樣例）

nal 嵌入 自己 rim 框架 ram art ner prim 1.問題描寫敘述 如今用戶開發的系統基本上趨向於BS架構的瀏覽器/server模式。這些系統可能由不同的語言開發。如HTML、ASP、JSP、PHP等。因此須要將制作好的報表嵌入到這些頁面中。 Fine

HTML5拖拽——將本地文件拖拽到網頁中顯示

ctype har char result html blank size func log HTML5標準中的提供的用於文件輸入輸出(I/O)的對象 File: 代表一個文件對象 FileList:

網頁中顯示pdf的方法

代碼 ner .cn logs 解決方法 ews param 復制 ng- 非常好的在網頁中顯示pdf的方法 今天有一需求，要在網頁中顯示pdf，於是立馬開始搜索解決方案，無意中發現一個非常好的解決方法，詳見http://blogs.adobe.com/pdfdev

在網頁中顯示PDF文件及vue項目中彈出PDF

參數 clsid extent uic tps 顯示 sig ont () 1、<embed width="800" height="600" src="test_pdf.pdf"> </embed> 　　 <embed v-show="pdf

如何直接在網頁中顯示PDF檔案

1、<embed width="800" height="600" src="test_pdf.pdf"> </embed>  通過的瀏覽器：360、Firefox、IE、Chrome  2、<object classid="clsid:CA

如何在伺服器端下載的網頁中顯示客戶端的圖片

一般情況下，網頁只能顯示伺服器上的圖片。 （網頁中的圖片都是從伺服器端請求來的圖片）。 如何實現頁面中顯示客戶端的圖片呢？（比如說在桌面上拖拽一個圖面到網頁中的容器中） HTML5中提供的用於檔案輸入輸出（I/O）的物件： File：代表一個檔案/目錄檔案物件 FileList：代表一個檔案

html網頁中顯示並且播放一個視訊,+播放一個音訊

    //src 為視訊路徑      height 為視訊高度            width為視訊寬度 <embed src="intro.swf" height=

java 上傳圖片至本地 並讀取圖片在網頁中顯示

java 上傳圖片至本地 並讀取圖片在網頁中顯示 程式碼+圖片如下所示 一、程式碼 @Controller public class ImageController { private static Logger logger = LoggerFactory.getLogge

虛擬環境下Django建立、執行專案、在網頁中顯示簡單的hello world！

Django建立專案及虛擬環境搭建 1.  使用workon 搭建基於python3.6的django開發環境 2. 進入虛擬環境，使用豆瓣源下載django框架，等待下載完成即可 推薦下載1.11版本 pip install django==1.11 3. 

如何在網頁中顯示資料圖表--Echarts入門教程

// 基於準備好的dom，初始化echarts例項 var myChart = echarts.init(document.getElementById('main')); // 指定圖表的配置項和資料 var option = {

在網頁中顯示PDF文件

網上的程式碼總有很多用不了的。我就貼上我試過可以用的。win7 64bit+chrome1.jquery.media.js<script type="text/javascript" src="/thinkphp/public/js/jquery-1.8.3.min.j

html網頁中顯示瀏覽器標題欄小圖示

HTML網頁的瀏覽器標題欄顯示小圖示的方法 就像這種效果，方法其實很簡單，就是 在head頭部裡寫： <link rel='icon' href='pic.ico ' type='image

非常好的在網頁中顯示pdf的方法

今天有一需求，要在網頁中顯示pdf，於是立馬開始搜尋解決方案，無意中發現一個非常好的解決方法，詳見http://blogs.adobe.com/pdfdevjunkie/web_designers_guide。 記錄一下主要程式碼： <script type="

檢視如何在一個 HTML 表格中顯示 XML 資料。

<script type="text/javascript">var xmlDoc=null;if (window.ActiveXObject){// code for IExmlDoc=new ActiveXObject("Microsoft.XMLDOM");}else if (documen

在 HTML中顯示XML資料的策略

一、資料繫結（ Data Binding ）技術 　　資料繫結技術適用於結構規則的 XML 文件，它對 XML 文件的資料用類似於關係資料庫的技術進行處理。 　　例如，有一個關於產品目錄的 XML 文件（ product.xml ）結構如下： …… <CATA

BASE64編碼的圖片在網頁中的顯示問題的解決

base64 問題 圖片 spi www. html nbsp base64編碼 href BASE64編碼的圖片在網頁中的顯示問題的解決 關於圖片的Base64編碼，你了解嗎？ BASE64編碼的圖片在網頁中的顯示問題的解決

網頁中圖片顯示方向與實際圖片方向不一致

服務 拍攝 blog 解決 log 照片 -o 不一致 oss 圖片為手機拍攝的照片，可能存在方向問題，exif.js可以解決。 參考 http://blog.csdn.net/cdnight/article/details/46457241 每張圖片在獲取到後都用exif

dtd檔案中寫的引用實體被xml檔案引用後無法在瀏覽器中顯示的問題

解決方案：把dtd檔案由被xml檔案外部引用改成被xml檔案內部引用。 例子： 1.xml檔案： <?xml version="1.0" encoding="UTF-8"?> <!--檔名：學生資訊管理 --> <!--關鍵字'SYSTEM'代表.DTD檔案來源於當前

在網頁中能正常顯示的頁面，在手機端出現問題？

只需要在頁面的head中加上如下程式碼即可： <meta name="viewport" id="viewport" content="width=device-width, initial-scale=1,minimum-scale=1,maximum-scale=1,use