[英]How do I style with XML
XML数据
<moblies>
<moblie>
<title>IPhone X</title>
<image>iphoneX.png</image>
<price>999</price>
</moblie>
</moblies>
CSS
moblies {
font-size:80%;
margin:0.5em;
font-family: Verdana;
display:block
}
moblie {
display:block;
border: 1px solid silver;
margin:0.5em;
padding:0.5em;
background-color:whitesmoke;
}
title, price {
display:block;
font-style: italic;
}
脚本
$(document).ready(function(){
$.ajax({
type: "GET",
url: "xml/data.xml",
dataType: "xml",
success: xmlParser
});
});
function xmlParser(xml) {
$('#load').fadeOut();
$(xml).find("moblie").each(function()
{
$("#container").append('<div class="moblie"><img src="images/' +
$(this).find("image").text() + '" width="200" height="300" alt ="' +
$(this).find("title").text() + '" /><br/><div class="title">' +
$(this).find("title").text() + '<br/>$' +
$(this).find("price").text() + '</div></div>');
$(".moblie").fadeIn(1000);
});
}
我正在尝试设置要导入的XML数据的样式,但是似乎无法真正了解如何执行此操作。 上面,我提供了我的XML,CSS和用于显示数据的脚本,如果有人对我出了问题的地方有任何想法,或者任何研究链接将不胜感激。
您有一个XML文档和一个CSS样式。
那么问题是您的输出格式是什么? 我只能猜测它应该是HTML-但也可以使用其他PDF(需要XML-FO )。
因此,您尝试的不是样式XML,而是将XML转换为HTML并将样式表应用于此输出(HTML)。
最好的方法是使用XSLT ,因为这种“语言”还具有转换XML的功能。 但是也可以通过像您这样的代码来完成。
另一个解决方案可能是使用regexp替换...
但最后但并非最不重要的一点是,我认为您忘了在结果中包括样式表,例如:
<link rel="stylesheet" type="text/css" media="all" href="layout.css" />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.