xslt：css在html页面中不起作用
Posted
技术标签:
【中文标题】xslt：css在html页面中不起作用【英文标题】：xslt: css not wotking in html page 【发布时间】：2019-09-14 18:03:15 【问题描述】：在 spring 项目中，我使用 XsltViewResolver 将 xml 转换为 html org.springframework.web.servlet.view.xslt.XsltViewResolver
在 html 输出代码中 css 不起作用。 XML 字符串：
<?xml version="1.0"?>
<kblc:kblcImportLc xmlns:kblc='http://www.kblc.com/schema/v1/kblc'>
<kblc:ImportStructureLC>
<kblc:ImportLCHeader>
<kblc:ApplicantInfo>
<kblc:ApplicantName>ApplicantTest</kblc:ApplicantName>
<kblc:ApplicantAddress>Spring Villa Park</kblc:ApplicantAddress>
<kblc:ApplicantCity>London</kblc:ApplicantCity>
<kblc:ApplicantPostalCode>HA8 7EB</kblc:ApplicantPostalCode>
<kblc:ApplicantCountry>UK</kblc:ApplicantCountry>
<kblc:ApplicantRegion>consistent</kblc:ApplicantRegion>
<kblc:ApplicantContactName>AA</kblc:ApplicantContactName>
<kblc:ApplicantEmail>email@mail.com</kblc:ApplicantEmail>
<kblc:ApplicantPhone>5856965456</kblc:ApplicantPhone>
<kblc:ApplicantFax>021548795</kblc:ApplicantFax>
</kblc:ApplicantInfo>
</kblc:ImportLCHeader>
</kblc:ImportStructureLC>
</kblc:kblcImportLc>
XSL 文件：
<?xml version="1.0"?>
<xsl:stylesheet version="2.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:kblc="http://www.kblc.com/schema/v1/kblc">
<xsl:output method="html" version="4.0" encoding="UTF-8" indent="yes"/>
<xsl:template match="/">
<html>
<head>
<title>Sports Info</title>
<style>
.HelpTitle
font: 13px verdana, sans-serif;
font-weight: bold;
text-decoration: underline;
margin-left: 5px;
margin-right: 5px;
.HelpText
font: 11px verdana, sans-serif;
margin-left: 5px;
margin-right: 5px;
.HelpHighlight
background-color: #55be28 ;
</style>
<script language="javascript" type="text/javascript">
function init ()
var url = new URL(document.location);
var str2 = url.searchParams.get("tagName");
document.getElementById(str2).className = "HelpHighlight";
document.getElementById("ErrorString").value="someContent";
document.getElementById("ErrorString123").value=str2;
document.getElementById(str2).focus();
</script>
</head>
<body onload="init();">
<xsl:apply-templates/>
</body>
</html>
</xsl:template>
<xsl:template match="kblc:kblcImportLc/kblc:ImportStructureLC">
<!-- Start ApplicantName -->
<div id="ApplicantName">
<br/>
<div class="HelpTitle">ApplicantName</div>
<br/>
<div class="HelpText">
<xsl:value-of select="kblc:ImportLCHeader/kblc:ApplicantInfo/kblc:ApplicantName" />
</div>
<div id="ErrorString123"></div>
<br/>
</div>
<!-- End ApplicantName -->
<!-- Start ApplicantAddress -->
<div id="ApplicantAddress">
<br/>
<div class="HelpTitle">ApplicantAddress</div>
<br/>
<div class="HelpText">
<xsl:value-of select="kblc:ImportLCHeader/kblc:ApplicantInfo/kblc:ApplicantAddress" />
</div>
<div id="ErrorString"></div>
<br/>
</div>
<!-- End ApplicantAddress -->
</xsl:template>
</xsl:stylesheet>
HTML 输出：
<html xmlns:kblc="http://www.kblc.com/schema/v1/kblc">
<head>
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Sports Info</title>
<style>
.HelpTitle
font: 13px verdana, sans-serif;
font-weight: bold;
text-decoration: underline;
margin-left: 5px;
margin-right: 5px;
.HelpText
font: 11px verdana, sans-serif;
margin-left: 5px;
margin-right: 5px;
.HelpHighlight
background-color: #55be28 ;
</style>
<script type="text/javascript" language="javascript">
function init ()
var url = new URL(document.location);
var str2 = url.searchParams.get("tagName");
document.getElementById(str2).className = "HelpHighlight";
document.getElementById("ErrorString").value="someContent";
document.getElementById("ErrorString123").value=str2;
document.getElementById(str2).focus();
</script>
</head>
<body onload="init();">
<div id="ApplicantName">
<br>
<div class="HelpTitle">ApplicantName</div>
<br>
<div class="HelpText">ApplicantTest</div>
<div id="ErrorString123"></div>
<br>
</div>
<div id="ApplicantAddress">
<br>
<div class="HelpTitle">ApplicantAddress</div>
<br>
<div class="HelpText">Spring Villa Park</div>
<div id="ErrorString"></div>
<br>
</div>
</body>
</html>
在这个 html css 中不起作用。
【问题讨论】：
在什么方面不起作用？如果我将生成的 HTML 粘贴到 .html 文件中，那么它在本地可以正常工作。 你想在 JavaScript 中做什么？将value 提供给<div> 不会做任何事情。你确定你有正确的tagName 参数吗？ （这是区分大小写的。）您使用的是什么浏览器？ url.searchParams 在 IE11 中没有实现。
@MrLister 是的，当我们通过另存为 .html 文件手动打开此 html 代码时，css 正在工作......但随后它由 java 代码（Spring mvc）打开 css 不工作......跨度>
@MrLister html 标记有名称空间这是因为 css 不工作吗？ <html xmlns:kblc="http://www.kblc.com/schema/v1/kblc">
【参考方案1】：
来自 cmets
html 标签有命名空间，这是因为 css 不工作吗？
不应该是这样的。但是如果你不想在 HTML 文档中输出那个奇怪的命名空间声明，那么在 xsl:stylesheet 元素中使用 exclude-result-prefixes atribute：
<xsl:stylesheet version="2.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:kblc="http://www.kblc.com/schema/v1/kblc"
exclude-result-prefixes="kblc">
【讨论】：
以上是关于xslt：css在html页面中不起作用的主要内容，如果未能解决你的问题，请参考以下文章
CSS 转换不起作用 Firefox for XML 文档使用 XSLT 转换为 HTML