js将load xml xslt文件生成html

最新推荐文章于 2019-08-01 16:17:38 发布
最新推荐文章于 2019-08-01 16:17:38 发布
阅读量89 收藏
点赞数
原文链接：http://www.cnblogs.com/zhihui516/archive/2008/10/12/1308873.html
版权

jsshowhtmlfromxmlxslt.html:

<html>

<head>

<script>

 

function loadXMLDoc(fname)
{
var xmlDoc;
// code for IE
if (window.ActiveXObject)
  {
  xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
  }
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation
&& document.implementation.createDocument)
  {
  xmlDoc=document.implementation.createDocument("","",null);
  }
else
  {
  alert('Your browser cannot handle this script');
  }
xmlDoc.async=false;
xmlDoc.load(fname);
return(xmlDoc);
}

 

function introduction()
{
xmlspec=loadXMLDoc("1.xml");
xslspec=loadXMLDoc("1.xslt");
// code for IE
if (window.ActiveXObject)
  {
  ex=xmlspec.transformNode(xslspec);
  document.getElementById("product_spec").innerHTML=ex;
  }
// code for Mozilla, Firefox, Opera, etc.
else if (document.implementation
&& document.implementation.createDocument)
  {
   
   xsltProcessor=new XSLTProcessor();
  xsltProcessor.importStylesheet(xslspec);
  resultDocument = xsltProcessor.transformToFragment(xmlspec,document);
  fxshow=document.getElementById("product_spec");
  divsecond=document.getElementById("divsecond");
  divsecond.removeChild(fxshow);
  fxshow=document.createElement("div");
  fxshow.id="product_spec";
  fxshow.appendChild(resultDocument);
  divsecond.appendChild(fxshow);
  }
}

 

</script>

</head>

<body>

<div id="divsecond" style="clear:both; width:420px;">
<div id="product_spec" ></div>
</div>

</body>

</html>

 

 

1.xml  :

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet Type="text/xsl" href="1.xslt"?>
<product>
   <product_name>Avanda MP4 N181 Digital Player</product_name>
   <item>NO.A455-1028</item>
   <price>$110.98</price>
   <list_price>$120.98</list_price>
   <you_save>$10.00</you_save>
   <grade_rating>images/4-stars.gif</grade_rating>
</product>

 

1.xslt  :

 

 

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="2.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"  xmlns:msxsl="urn:schemas-microsoft-com:xslt" xmlns:user="anything here"  >
<xsl:template match="/">
<html>
<head>
<style type="text/css">
body {TEXT-ALIGN: center;}
#center { MARGIN-RIGHT: auto; MARGIN-LEFT: auto; }
.specials{ font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:bold; text-align:left}
.apply{ font-family:Arial, Helvetica, sans-serif; font-size:13px; text-align:left}
</style>
</head>
<body topmargin="0">
<div  id="center" style="width:420px;">
 <div>
<table cellpadding="0" cellspacing="0" border="0"><tr ><td  valign="middle" height="40" bgcolor="#f3f3f3" width="420" style="font-family:Arial, Helvetica, sans-serif; font-size:20px;" align="center"><xsl:value-of select="product/product_name"></xsl:value-of></td></tr></table>
 </div>
 <div style="font-family:Arial, Helvetica, sans-serif; font-size:14px; text-align:left; margin-left:65px; margin-top:7px; margin-bottom:18px; font-weight: 500;">Item: <xsl:value-of select="product/item"></xsl:value-of></div>
 <div style="margin-left:65px; font-family:Arial, Helvetica, sans-serif; font-size:13px; line-height:25px;">
 <div style="float:left">Our Price:</div><div style="float:left; margin-left:23px;  color:#d90000; font-weight:bold; letter-spacing:1.2px;"><xsl:value-of select="product/price"></xsl:value-of></div><br/>
 <div style="float:left">List Price:</div><div style="float:left; margin-left:26px; font-weight:bold; color:#222222; letter-spacing:1.2px;"><xsl:value-of select="product/list_price"></xsl:value-of></div><br/>
 <div style="float:left">Your Save:</div><div style="float:left; margin-left:23px; font-weight:bold; color:#222222; letter-spacing:1.2px;"><xsl:value-of select="product/you_save"></xsl:value-of></div><br/>
 <div style="float:left; margin-top:15px;">Quantity:</div>
 <div style="float:left; margin-left:30px; margin-top:15px;">
 <select>
   <option value="first" selected="selected">1</option>
   <option>2</option>
   <option>3</option>
   <option>4</option>
 </select>
 </div>
 <div style="clear:both">
 <div style="float:left; margin-top:5px;">Grade:</div><div style="float:left; margin-left:23px; margin-top:10px;">
 <xsl:variable   name="pic"><xsl:value-of   select="product/grade_rating"  /></xsl:variable>  
                   <img src="{$pic}"   />      
 </div></div>
 <div style="clear:both; text-align:left"><img src="images/Unigroup-web-design-product.2.7_16.gif"/></div>
 </div>
 
 </div>
</body>
</html>

</xsl:template>
</xsl:stylesheet>

 

这三个文件放在同一目录下面。有问题请联系我。http://285694348.paipai.com   这个网站有我的联系方式

 

转载于:https://www.cnblogs.com/zhihui516/archive/2008/10/12/1308873.html

weixin_30632883
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
使用XSLT将XML转换为HTML
qq_41607676的博客
09-22 1932
使用VScode 插件将XML 转换为HTML
使用XSLT将XML数据转换成HTML
斯斯细语
11-05 1167
 使用一个简单的 XSL 样式表就可以将 XML 数据转换成 HTML。随着 XML 规范的不断演进，在新的版本中满足每个人的需要似乎已经成为必要；不幸的是，进行简单的转换一直都困扰着规范。假设我有一个表示一个页面内容的 XML　数据，现在我想将其内容转换成布局。下面是我想要转换的 XML：                        Folder 1                  
通过xslt把xml转换成html
weixin_30918633的博客
03-21 136
将内容与内容的表现分离，软件界自从成为一个行业以来一直在追求的目标。 xml+xslt是典型的数据与表现分离的设计方式。当然，你可以直接转换成HTML，但是如果你要进行整体变化的时候，XML+XSLT的优势就体现出来了。同样的数据，因为你已经有XML，已经不需要再进行一次数据库的访问，只要更换了XSLT，就可以生成新的HTML。另外，XML+XSLT的性能也是很优秀的。 转载于:https://...
JS操作XML，按照XSLT逻辑，输出到HTML
winvay的专栏
08-03 522
var outxml = trans(); document.getElementById("div0").innerHTML = outxml; function trans(inxml) { var stylesheet = new Act
XSLT
保卫的专栏
11-28 608
 1、XSLT 简介　　XSLT 是一种用于将 XML 文档转换为 XHTML 文档或其他 XML 文档的语言。　　XPath 是一种用于在 XML 文档中进行导航的语言。　　什么是 XSLT？　　XSLT 指 XSL 转换（XSL Transformations）。　　XSLT 是 XSL 中最重要的部分。　　XSLT 可将一种 XML 文档转换为另外一种 XML 文档。
兼容Firefox的Javascript XSLT 处理XML文件
10-24
在现代网页开发中，处理XML文件是常见需求之一，特别是在动态生成网页内容和数据交换时。XSLT（Extensible Stylesheet Language Transformations）是一种用于转换XML文档的语言，它允许我们定义如何将XML文档转换为...
使用XSLT将XML文档转换成HTML文档
02-09
最后，我们将使用 JavaScript 语言来将 XML 文档和 XSLT 文件加载到 HTML 文档中，并将其转换成 HTML 文档。 <html> 使用 XSLT 实现 XML 文档到 HTML 文档的转换 <script language="JavaScript"> function ...
Javascript+Xslt解析Xml为Html的方法.pdf
10-05
本文将详细探讨如何使用JavaScript与XSLT来解析XML并生成HTML。 首先，XSLT是一种样式表语言，专门用于转换XML文档。它允许开发者定义一系列规则，根据这些规则，XML文档可以被转换成其他格式，如HTML、PDF或纯文本...
Javascript+Xslt解析Xml为Html的方法[参照].pdf
10-11
以下是一个使用JavaScript和XSLT解析XML并生成HTML的示例： ```javascript function openBdp(bdpID, name) { var xslt = new ActiveXObject("Msxml2.XSLTemplate.3.0"); var xslDoc = new ActiveXObject("Msxml2....
xslt控制xml样式并被html、c#后台调用
11-06
当浏览器加载XML文档时，会同时加载指定的XSLT文件，然后将XML转换为HTML。这种方式使得前端展示可以根据需要动态地调整样式，提高用户体验。例如，可以创建多个XSLT模板，通过JavaScript根据用户的选择动态切换不同...
XML XSLT
zsfsmartfish的专栏
02-11 538
1、科普 eXtensible Stylesheet Language Transformation 最初帮助XML文档转换为其他文档，但是后来不仅仅转换为HTML。 由于xml是电脑程序间交换原始数据的简单而标准的方法【将数据和表达式分离；在不同应用程序间传输；】 XPath即为XML路径语言，它是一种用来确定XML（标准通用标记语言的子集）文档中某部分位置的语言。XPath基于XML的树
用xslt 把xml转换成html的几个实例（1）
weixin_30865427的博客
05-05 117
最近在忙着给公司xslt转档，刚开始学，碰到了很多问题。也翻阅过很多资料，但是很少有实例的书籍（如果哪位朋友能介绍几本有实例的书籍，推荐几本吧，不胜感激） 下面是我碰到的一些问题，帖出来，只求大家能更好的学习。希望对大伙有帮助。 5-3.xslt 文件 1 <?xml version="1.0"?> 2 <xsl:stylesheet version="1...
XML+XSLT
winggyn的专栏
05-06 750
要实现的一个功能就是在JAVA的服务器端将数据库中的数据取出然后写入XML中，然后XML+XSLT相结合再转换为HTML代码片段。 基本的思路如下： 第一步，就是首先将数据和XML绑定。可以使用JAXB将数据写入XML。但是此处并不打算这么做。因为XML结构不复杂。所以决定还是通过程序将数据与XML绑定。本例子假设数据与XML绑定已经完成。 第二步，将XSL解析设置放到内存中缓存起来等待
XML & XSLT
weixin_30740581的博客
08-01 117
http://blog.tangcs.com/2008/09/04/xml-xslt/ 转载于:https://www.cnblogs.com/WarrenTang/archive/2008/09/04/1284109.html
XML和XSLT
James Blog
09-17 300
XML: Extensible Markup Language 可扩展标记语言1、XML相关知识        XML是从1996年开始有其雏形，并向 W3C（全球信息网联盟）提案，而在1998二月发布为W3C的标准（XML1.0）。 XML的前身是SGML（The Standard Generalized Markup Language），是自IBM从60年代就开始发展的 GML（General...
XML与XSLT
Chris Mao的专栏
10-15 1720
        之前有谈过XML与CSS的搭配，可以让用户拥有多种数据显示样式。但这种搭配亦有不足之处，首先 编写者必须了解和掌握XML和CSS两种语法规则，无形中增加了编写者的知识成本；其次，编写者无法对数据进行查询性的显示，即通过XML与CSS的搭配只能将所有数据全部显示出来，无法实现只显示符合某种条件的数据。       为了降低编写者的知识成本，W3C组织又在XML文件基础之上定义了新
xml和xslt
MECHEAL的专栏
08-19 685
年初的时候培训teamsite,  新加坡的老师，比较专业，是我参加的所有培训讲的最好的，学习的过程中老师还顺便讲了些xslt的知识，这个东西很不错，它实现了数据和样式的分离，而且在最近的开发sharepoint时候还用到了，就是sharepoint的 xmlwebpart, 为了便于以后的使用把w3c的例子改了一下，记下来。首先xml没有什么特别的如下：Empire BurlesqueBob DylanUSAColumbia10
XSLT：XML转多种文档的强大工具
XSLT（eXtensible Stylesheet Language Transformations）是一种强大的XML文档处理语言，用于将XML数据转换为多种格式的输出，以便适应不同的展示需求。在本课件中，学习者可以深入了解XSLT的工作原理和应用技巧。 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值