用xslt+css让RSS显示的跟网页一样漂亮

前端  /  管理员 发布于 7年前   155

最近开始研究 XML+XSLT+CSS 构造网页..又拿自己的站的一部分当成实验品..
因为我把这个站的实验室的东西扔在别一个服务器上..可又懒得再做个首页,,,就同步了这边的 RSS.当首页
可没关联的样式的XML怎样看怎样不喜欢....

直接关联 CSS 能把 XML 能变成像样一点..虽然不是最终目的..可还是要学习一下..因为不是所有的浏览器都支持XSLT 
我能用到的浏览器好像都能认识关联的 CSS ~可惜单单 CSS 能做的事太少了. 还是xslt好..

写直接用于 XML 的 CSS 跟平时写的 CSS 基本没什么差别...只是元素名不同了.难度高高...写 HTML 的自由没有了...也不可以因为想要某个效果而乱加元素...
好像我的水平决定了我只能写出定义得比文本好看一下下的CSS, 接着.看例子. 跳掉..研究 XSLT 了

xslt 能做的事很多..xml 终于可以直接当网页用了..

打开一份别人写好的 xslt 发现....好多熟悉的东东..........
对于应用在RSS..我们对XLST只要知道

xsl:for-each select="rss/channel/item" 
xsl:value-of select="..." 
disable-output-escaping="yes" 
一个循环 一个选择节点....一个设置禁止输出转义时 
接着复制了我程序用的模板文件.....把 smarty 的标签直接换成 xsl 的..太像了..我连 html 都不用写..一路复制..
等网站的核心程序写完后我一定要尝试用xslt直接做smarty模板...

接着整理出一个单独的CSS 本以为就这样完了.........
-____________-!! 每次做网页时总会有些浏览器会闹闹情绪...这回是 moz 内核的....
我需要显示 CDATA 里的 HTML ,让他更像个网页,
可搜索跟我说 Mozilla 的 Transformiix 不支持 disable-output-escaping

我记得 feedburner 能在 Firefox 显示 CDATA 里的 HTML 代码~
看了他的 xslt 跟搜索的结果发现.......基本都是用JS的innerHTML把内容再写进一次就能显示........

原因我也不清楚.....学着大家方法.把 disable-output-escaping 勉强解决了.........

写 JS 时又发现...JS 有些怪怪的...比如....直接写在 xslt 里跟外链有些不同..
本想就一个页..一个 function 乱写能运行就行....结果又发现N多奇怪的问题..暂时也没时间去研究他....等有空再写些测试...

说了这样多的废话..
大家看看我的学习的结果, http://lab.loaoao.com 

扩展阅读 
http://www.w3.org/TR/xslt/ 
http://www.xml.org.cn/list.asp?boardid=8 
www.w3schools.com/xsl/ 
hedong.3322.org/archives/000044.html