使用XSLT将XHTML转换为另一个XHTML

时间:2022-05-22 04:52:39

I have two XHTML files and my task is to convert from one to another with XSLT (or any other method by Java Program). I searched but I didn't get any example for this, all are related for converting one XML to another with XSLT or little bit information for one XHMTL to other. So can anyone please explain the procedure with one example containing source, desired and XSLT files by using my XHTML files or any other. II'll be very much thankful for that.

我有两个XHTML文件,我的任务是使用XSLT(或Java程序的任何其他方法)从一个转换为另一个。我搜索了但是我没有得到任何这样的例子,所有这些都与使用XSLT将一个XML转换为另一个XML或将一个XHMTL转换为其他XML的一点点信息有关。所以任何人都可以通过使用我的XHTML文件或任何其他文件,通过一个包含source,desired和XSLT文件的示例来解释该过程。我将非常感谢。

Source file [1]-

源文件[1] -

<?xml version="1.0" encoding="UTF-8"?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-type" content="text/html;  charset=utf-8" />  
<title>eXe</title>  
<style type="text/css">  
@import url(base.css);  
@import url(content.css);  
</style>  
<script type="text/javascript" src="common.js"></script>  
</head>  
<body>  
<div id="outer">  
<div id="main">  
<div id="nodeDecoration">  
<p id="nodeTitle">  
Part 1</p>  
</div>  
<div class="TrueFalseIdevice" id="id12">  
<script type="text/javascript" src="common.js"></script>  
<!--THIS JAVASCRIPT HAS TO BE ELIMINATED-->  
<script type="text/javascript" src="libot_drag.js"></script>  
<div class="iDevice emphasis1">  
<img alt="" class="iDevice_icon" src="icon_question.gif" />  
<span class="iDeviceTitle">True-False Question</span><br/>  
<div class="iDevice_inner">  
<div id="ta12_16" class="block" style="display:block">  

</div><div class="question">  
<br/><br/><div id="taquestion0b12" class="block" style="display:block">1><span style="color: #000000; font-family: Verdana,Arial,Helvetica,sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; background-color: #ffffff; display: inline ! important; float: none"> SQL Stands for Structure Query Language?</span>   

<!--THIS ONCLICK EVENT HAS TO BE REMOVED-->  
</div><br/>True <input type="radio" name="option0b12" id="true0b12" onclick="getFeedback(0,2,'0b12','truefalse')"/>   
False <input type="radio" name="option0b12" id="false0b12" onclick="getFeedback(1,2,'0b12','truefalse')"/>  
<div id="s0b0b12" style="color: rgb(0, 51, 204);display: none;" even_steven="18">Correct! </div>  
<div id="s1b0b12" style="color: rgb(0, 51, 204);display: none;" even_steven="19">Incorrect! </div>  
<div id="sfbk0b12" style="color: rgb(0, 51, 204);display: none;"><div id="tafeedback0b12" class="block" style="display:block">  

</div></div>  
</div>  
</div>  
</div>  
</body></html> 

Desired File [1]:

期望的文件[1]:

<?xml version="1.0" encoding="UTF-8"?>  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<title>eXe</title>  
<meta http-equiv="Content-Type" content="text/html;  charset=utf-8" />  
<!-- Created using eXe: http://exelearning.org -->  
<style type="text/css">  
@import url(base.css);  
@import url(content.css);  
</style>  
<script type="text/javascript" src="common.js"></script>  
</head>  
<!--THESE TWO JAVASCRIPT HAVE TO BE INCLUDED-->  
<script type="text/javascript" src="APIWrapper.js"></script>  
<script type="text/javascript" src="SCOFunctions.js"></script>  
<body onload="loadPage()" onunload="unloadPage()"><div id="outer">  
<div id="main">  
<div id="nodeDecoration">  
<p id="nodeTitle">  
Part 1</p></div>  
<div class="QuizTestIdevice" id="id8">  
<!--THIS JAVASCRIPT AND FORM HAVE TO BE INCLUDED-->  
<script type="text/javascript" src="calculate.js"></script>  
<form name="quizForm8" id="quizForm8" action="javascript:calcScore2();">  
<div class="iDevice emphasis1">  
<img alt="" class="iDevice_icon" src="icon_question.gif" />  
<span class="iDeviceTitle">SCORM Quiz</span>  
<div class="iDevice_inner">  
<div class="passrate" value="50"></div>  
<div class="question">  
<div id="taquestion0b8" class="block" style="display:block">1> SQL Stands for Structure Query Language?  

</div><br/>  
<table><tr><td><input type="radio" name="key0b8" value="0" />  
</td><td>  
<div id="taoptionAnswer0q0b8" class="block" style="display:block">True  

</div></td></tr>  
<tr><td><input type="radio" name="key0b8" value="1" />  
</td><td>  
<div id="taoptionAnswer1q0b8" class="block" style="display:block">False  

</div></td></tr>  
</table></div>  
<!--THIS SUBMIT BUTTON HAS TO BE INCLUDED-->  
<br/><input type="submit" name="submitB" value="SUBMIT ANSWERS"/>  
</div></div>  
</form>  
</div>  
</div>  
</div>  
</body></html>  

COMPLETE SOURCE FILE [2]-

完整的源文件[2] -

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html;  charset=utf-8" />
<title>eXe</title>
<style type="text/css">
@import url(base.css);
@import url(content.css);
</style>
<script type="text/javascript" src="common.js"></script>
</head>
<body>
<div id="outer">
<div id="main">
<div id="nodeDecoration">
<p id="nodeTitle">
Part 2</p>
</div>
<div class="TrueFalseIdevice" id="id13">

<script type="text/javascript" src="common.js"></script>
<script type="text/javascript" src="libot_drag.js"></script>

<div class="iDevice emphasis1">
<img alt="" class="iDevice_icon" src="icon_question.gif" />
<span class="iDeviceTitle">True-False Question</span><br/>
<div class="iDevice_inner">
<div id="ta13_16" class="block" style="display:block">
</div>

<div class="question">
<br/><br/><div id="taquestion0b13" class="block" style="display:block">1: Can a table have more than one primary key?

</div><br/>True <input type="radio" name="option0b13" id="true0b13" onclick="getFeedback(0,2,'0b13','truefalse')"/> 
False <input type="radio" name="option0b13" id="false0b13" onclick="getFeedback(1,2,'0b13','truefalse')"/>
<div id="s0b0b13" style="color: rgb(0, 51, 204);display: none;" even_steven="18">Correct! </div>
<div id="s1b0b13" style="color: rgb(0, 51, 204);display: none;" even_steven="19">Incorrect! </div>
<div id="sfbk0b13" style="color: rgb(0, 51, 204);display: none;"><div id="tafeedback0b13" class="block" style="display:block">
</div></div></div>

<div class="question">

<br/><br/><div id="taquestion1b13" class="block" style="display:block"><span style="color: #000000; font-family: Verdana,Arial,Helvetica,sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; background-color: #ffffff; display: inline ! important; float: none">2: A row in a database can also be called a domain.</span>

</div><br/>True <input type="radio" name="option1b13" id="true1b13" onclick="getFeedback(0,2,'1b13','truefalse')"/> 

False <input type="radio" name="option1b13" id="false1b13" onclick="getFeedback(1,2,'1b13','truefalse')"/>

<div id="s0b1b13" style="color: rgb(0, 51, 204);display: none;" even_steven="19">Incorrect! </div>
<div id="s1b1b13" style="color: rgb(0, 51, 204);display: none;" even_steven="18">Correct! </div>
<div id="sfbk1b13" style="color: rgb(0, 51, 204);display: none;"><div id="tafeedback1b13" class="block" style="display:block">
</div></div>
</div>

<div class="question">

<br/><br/><div id="taquestion2b13" class="block" style="display:block"><span style="color: #000000; font-family: Verdana,Arial,Helvetica,sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; background-color: #ffffff; display: inline ! important; float: none">3: In an OO database objects may inherit some or all of the characteristics of other objects.</span>

</div><br/>True <input type="radio" name="option2b13" id="true2b13" onclick="getFeedback(0,2,'2b13','truefalse')"/> 
False <input type="radio" name="option2b13" id="false2b13" onclick="getFeedback(1,2,'2b13','truefalse')"/>
<div id="s0b2b13" style="color: rgb(0, 51, 204);display: none;" even_steven="18">Correct! </div>
<div id="s1b2b13" style="color: rgb(0, 51, 204);display: none;" even_steven="19">Incorrect!</div>
<div id="sfbk2b13" style="color: rgb(0, 51, 204);display: none;"><div id="tafeedback2b13" class="block" style="display:block">
</div></div>
</div>

<div class="question">

<br/><br/><div id="taquestion3b13" class="block" style="display:block"><span style="color: #000000; font-family: Verdana,Arial,Helvetica,sans-serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: normal; orphans: 2; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; background-color: #ffffff; display: inline ! important; float: none">4: In entity attribute modelling a many to many relationship is represented by M:M.</span>

</div><br/>True <input type="radio" name="option3b13" id="true3b13" onclick="getFeedback(0,2,'3b13','truefalse')"/> 

False <input type="radio" name="option3b13" id="false3b13" onclick="getFeedback(1,2,'3b13','truefalse')"/>

<div id="s0b3b13" style="color: rgb(0, 51, 204);display: none;" even_steven="19">Incorrect! </div>
<div id="s1b3b13" style="color: rgb(0, 51, 204);display: none;" even_steven="18">Correct! </div>
<div id="sfbk3b13" style="color: rgb(0, 51, 204);display: none;"><div id="tafeedback3b13" class="block" style="display:block">

</div></div></div></div></div></div></div></div>
</body></html>

My XSLT-

我的XSLT-

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
      <!-- Import the identity transformation. -->
      <xsl:import href="identity.xsl"/>

      <xsl:template match="@onclick">

      </xsl:template>
      <xsl:template match="@style"/>

      <xsl:template match="input">
        <xsl:element name="input">
          <xsl:attribute name="type">submit</xsl:attribute>
          <xsl:attribute name="name">submitB</xsl:attribute>
          <xsl:attribute name="value">Submit</xsl:attribute>
          <xsl:apply-templates />
        </xsl:element>
      </xsl:template>

    </xsl:stylesheet>

COMPLETE DESIRED FILE [2]-

完整的期望文件[2] -

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>eXe</title>
<meta http-equiv="Content-Type" content="text/html;  charset=utf-8" />
<style type="text/css">
@import url(base.css);
@import url(content.css);
</style>
<script type="text/javascript" src="common.js"></script>
</head>

<script type="text/javascript" src="APIWrapper.js"></script>
<script type="text/javascript" src="SCOFunctions.js"></script>

<body onload="loadPage()" onunload="unloadPage()"><div id="outer">
<div id="main">

<div id="nodeDecoration">
<p id="nodeTitle">
Part 2</p></div>
<div class="QuizTestIdevice" id="id10">

<script type="text/javascript" src="calculate.js"></script>

<form name="quizForm10" id="quizForm10" action="javascript:calcScore2();">
<div class="iDevice emphasis1">
<img alt="" class="iDevice_icon" src="icon_question.gif" />
<span class="iDeviceTitle">SCORM Quiz</span>
<div class="iDevice_inner">
<div class="passrate" value="50"></div>

<div class="question">
<div id="taquestion0b10" class="block" style="display:block">1: Can a table have more than one primary key?
</div><br/>

<table><tr><td><input type="radio" name="key0b10" value="0" />
</td><td>
<div id="taoptionAnswer0q0b10" class="block" style="display:block">True
</div></td></tr>
<tr><td><input type="radio" name="key0b10" value="1" />
</td><td>
<div id="taoptionAnswer1q0b10" class="block" style="display:block">False
</div></td></tr>
</table></div>

<br/><div class="question">
<div id="taquestion1b10" class="block" style="display:block"><span class="Ques">2: A row in a database can also be called a domain.
</span>
</div><br/>
<table><tr><td><input type="radio" name="key1b10" value="0" />
</td><td>
<div id="taoptionAnswer0q1b10" class="block" style="display:block">True
</div></td></tr>
<tr><td><input type="radio" name="key1b10" value="1" />
</td><td>
<div id="taoptionAnswer1q1b10" class="block" style="display:block">False
</div></td></tr>
</table></div>

<br/><div class="question">
<div id="taquestion2b10" class="block" style="display:block"><span class="Ques">3: In an OO database objects may inherit some or all of the characteristics of other objects.
</span>
</div><br/>
<table><tr><td><input type="radio" name="key2b10" value="0" />
</td><td>
<div id="taoptionAnswer0q2b10" class="block" style="display:block">True
</div></td></tr>
<tr><td><input type="radio" name="key2b10" value="1" />
</td><td>
<div id="taoptionAnswer1q2b10" class="block" style="display:block">False
</div></td></tr>
</table></div>

<br/><div class="question">
<div id="taquestion3b10" class="block" style="display:block"><span class="Ques">4: In entity attribute modelling a many to many relationship is represented by M:M.</span>
</div><br/>
<table><tr><td><input type="radio" name="key3b10" value="0" />
</td><td>
<div id="taoptionAnswer0q3b10" class="block" style="display:block">True
</div></td></tr>
<tr><td><input type="radio" name="key3b10" value="1" />
</td><td>
<div id="taoptionAnswer1q3b10" class="block" style="display:block">False
</div></td></tr>
</table></div>

<br/><input type="submit" name="submitB" value="SUBMIT ANSWERS"/>
</div></div>
</form>
</div></div></div>
</body></html>

1 个解决方案

#1


1  

Everything you read about transforming XML using XSLT is applicable to transforming XHTML, because XHTML is XML. It's hard to see what's difficult about your problem, other than working out how general the solution needs to be: is this the only document that needs to be transformed (if so, why not use a text editor?) or are there others that are similar, and if so how much do they differ?

您阅读的有关使用XSLT转换XML的所有内容都适用于转换XHTML,因为XHTML是XML。除了弄清楚解决方案需要的一般性之外,很难看出你的问题有多难:这是唯一需要转换的文档(如果是这样,为什么不使用文本编辑器?)或者是否有其他文档?类似,如果是这样,他们有多大差异?

The general approach to writing a transformation that copies most things but deletes a few things is to write two template rules: a general identity template that copies things you want to copy, and a special rule that matches the things you want to delete.

编写复制大多数东西但删除一些东西的转换的一般方法是编写两个模板规则:复制要复制的东西的通用标识模板,以及与要删除的内容匹配的特殊规则。

See here for variations on the theme:

请参阅此处了解主题的变化:

http://www.dpawson.co.uk/xsl/sect2/identity.html

http://www.dpawson.co.uk/xsl/sect2/identity.html

#1


1  

Everything you read about transforming XML using XSLT is applicable to transforming XHTML, because XHTML is XML. It's hard to see what's difficult about your problem, other than working out how general the solution needs to be: is this the only document that needs to be transformed (if so, why not use a text editor?) or are there others that are similar, and if so how much do they differ?

您阅读的有关使用XSLT转换XML的所有内容都适用于转换XHTML,因为XHTML是XML。除了弄清楚解决方案需要的一般性之外,很难看出你的问题有多难:这是唯一需要转换的文档(如果是这样,为什么不使用文本编辑器?)或者是否有其他文档?类似,如果是这样,他们有多大差异?

The general approach to writing a transformation that copies most things but deletes a few things is to write two template rules: a general identity template that copies things you want to copy, and a special rule that matches the things you want to delete.

编写复制大多数东西但删除一些东西的转换的一般方法是编写两个模板规则:复制要复制的东西的通用标识模板,以及与要删除的内容匹配的特殊规则。

See here for variations on the theme:

请参阅此处了解主题的变化:

http://www.dpawson.co.uk/xsl/sect2/identity.html

http://www.dpawson.co.uk/xsl/sect2/identity.html