前台HTML页面显示XML内容

应用场景:在网站开发过程中,读取XML格式文件,并将其所有内容都显示到页面上,即显示标签内容,又显示标签本身。
备注:本博客场景还适应于读取显示含有标签的数据库存储字段。
解决方法:解决方法一共有四种(可能还有别的方法,但我只知道四种,欢迎大家补充),分别如下:
第一种,使用<xmp></xmp>
将你要显示的内容包含在<xmp></xmp>标签中,便可以将标签显示在页面上。
JS代码:
<script>
var str1 = "<xmp><dataId>500113_20130114 <dataId><dataName>姓名是:xyong</dataName></xmp>";
document.write(str1);
</script>


第二种,jstl的<c:out />
假设后台返回到页面的数据为<dataId>500113_20130114 <dataId><dataName>姓名是:xyong</dataName>
HTML代码:
<c:out value="${xxxx}" escapeXml="false" />

第三种,控制层将 "<" 换为 "&lt;" , ">" 换为 "&gt;" “"”用&quot;表示
在后台控制层获取数据后,使用字符串String的 replaceAll() 方法,将获取数据中的"<" 换为 "&lt;" , ">" 换为 "&gt;"
Java代码:
String str = "<dataId>500113_20130114 <dataId><dataName>姓名是:xyong</dataName>";
str = str.replaceAll("<", "<").replaceAll(">", ">");
System.out.println(str);

第四种,通过ajax获取数据,然后通过innerText输出到页面上
JS代码:
var str1 = "<dataId>500113_20130114 <dataId>\n<dataName>姓名是:xyong</dataName>";
document.getElementsByClassName("div1")[0].innerText=str1;
注意:当使用innerText进行页面输出时,使用 "\n" 可以进行换行。
HTML代码:
<div class="div1"></div>
<style>
.div1{
height:100px;
border:1px solid black;
}
</style>

posted @ 2019-08-02 15:04  长袖保暖  阅读(563)  评论(0编辑  收藏  举报