快捷導(dǎo)航

javascript XML數(shù)據(jù)顯示為HTML一例

更新時(shí)間：2008年12月23日 16:00:06 作者：

通過Javascript把xml轉(zhuǎn)換成html格式輸出一列

person.htm:

<html> 
<body> 
<script type="text/javascript"> 
var xmlDoc=null; 
if (window.ActiveXObject) 
{ 
// for IE 
xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); 
} 
else if (document.implementation.createDocument) 
{ 
//for Mozilla, Firefox, Opera, 
xmlDoc=document.implementation.createDocument("","",null); 
} 
else 
{ 
alert('Your browser cannot handle this script'); 
} 
if (xmlDoc!=null) 
{ 
xmlDoc.async=false; 
xmlDoc.load("person.xml"); 
document.write("<table border='1'>"); 
var x=xmlDoc.getElementsByTagName("person"); 
for (i=0;i<x.length;i++) 
{ 
document.write("<tr>"); 
document.write("<td>"); 
document.write( 
x[i].getElementsByTagName("myname")[0].childNodes[0].nodeValue); 
document.write("</td>"); 
document.write("<td>"); 
document.write( 
x[i].getElementsByTagName("myid")[0].childNodes[0].nodeValue); 
document.write("</td>"); 
document.write("</tr>"); 
} 
document.write("</table>"); 
} 
</script> 
</body> 
</html>

person.xml:

復(fù)制代碼代碼如下:

<?xml version="1.0" encoding="utf-8"?> 
<root> 
<person> 
<myname>chwuweig</myname> 
<myid>123456</myid> 
</person> 
<person> 
<myname>cig</myname> 
<myid>526636</myid> 
</person> 
<person> 
<myname>chwg</myname> 
<myid>524216</myid> 
</person> 
</root>

您可能感興趣的文章:

相關(guān)文章

ES6入門教程之let和const命令詳解
最近做項(xiàng)目的過程中，使用到了ES6，因?yàn)橹昂苌俳佑|，所以使用起來還不夠熟悉。通過學(xué)習(xí)網(wǎng)上的教程后覺著有必要整理下遇到的let和const命令，所以這篇文章主要給大家介紹了ES6中l(wèi)et和const命令的相關(guān)資料，需要的朋友可以參考下。
2017-05-05
js使用文件流下載csv文件的實(shí)現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于js使用文件流下載csv文件的實(shí)現(xiàn)方法，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用js具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
2019-07-07
JS中如何輕松遍歷對象屬性的方式總結(jié)
這篇文章主要給大家總結(jié)介紹了關(guān)于在JS中如何輕松遍歷對象屬性的方式，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用JS具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧
2019-08-08
javascript實(shí)時(shí)顯示北京時(shí)間的方法
這篇文章主要介紹了javascript實(shí)時(shí)顯示北京時(shí)間的方法,涉及javascript操作時(shí)間顯示的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
詳解在IDEA中將Echarts引入web兩種方式(使用js文件和maven的依賴導(dǎo)入)
這篇文章主要介紹了在IDEA中將Echarts引入web兩種方式(使用js文件和maven的依賴導(dǎo)入),本文通過圖文并茂的形式給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2020-07-07
關(guān)于axios返回空對象的問題解決
這篇文章主要給大家介紹了關(guān)于axios返回空對象的問題解決方法，文中介紹的非常詳細(xì)，相信對大家學(xué)習(xí)或者使用axios具有一定的參考價(jià)值，需要的朋友們下面來一起看看吧。
2017-04-04
javascript彈出窗口中增加確定取消按鈕
本文給大家分享的是在ECShop的項(xiàng)目中使用到的一個(gè)小功能，使用JavaScript實(shí)現(xiàn)彈出窗口中增加確定取消按鈕，有需要的小伙伴可以參考下
2016-06-06
javascript中創(chuàng)建對象的幾種方法總結(jié)
以下幾種，是javascript中最常用的創(chuàng)建對象的方式。初學(xué)者看到后，可能會暈掉，甚至?xí)X得擔(dān)心。其實(shí)完全不用擔(dān)心，這些種方式，只需要掌握一兩種，對其他的幾種只需要理解就好了
2013-11-11
一篇文章搞定JavaScript類型轉(zhuǎn)換(面試常見)
這篇文章主要介紹了一篇文章搞定JavaScript類型轉(zhuǎn)換(面試常見)，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下吧
2017-01-01
深入理解JS中attribute和property的區(qū)別
property 和 attribute非常容易混淆，但實(shí)際上，二者是不同的東西，屬于不同的范疇，本文就詳細(xì)的介紹一下JS中attribute和property的區(qū)別，感興趣的可以了解一下
2022-02-02