如何使用XSL将XML文档中的CDATA注释输出为HTML文本,在项目中用到,特记录一下:
示例代码:
1. test.xml
<?xml version="1.0" encoding="gb2312"?>
<?xml-stylesheet href="test.xsl" type="text/xsl"?>
<entry>
<title>entry with images</title>
<date>August 09, 2003</date>
<author>Kevin</author>
<idnum>000033</idnum>
<permalink>http://alazanto.org/xml/archives/000033.xml</permalink>
<body xmlns:html="http://www.w3.org/1999/xhtml"><![CDATA[<p><img
class="archive" align="right" src="http://alazanto.org/images/sample.jpg"
alt="photograph of a flower, just for show"/>Mauris felis elit, varius
quis, pulvinar vel, sodales vehicula, mi. Nunc elementum pharetra elit.
</p>]]>
</body>
<more xmlns:html="http://www.w3.org/1999/xhtml"><![CDATA[]]></more>
<comment-link>http://alazanto.org/xml/archives/000033_comments.xml</comment-link>
<comment-count>6</comment-count>
</entry>
2. test.xsl
<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:template match="/entry">
<html>
<head>
</head>
<body>
<xsl:value-of select="title" />
<xsl:value-of select="body" disable-output-escaping="yes"/>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
关键之外在于使用的命名空间xmlns:xsl=”http://www.w3.org/1999/XSL/Transform” 和输出时加上disable-output-escaping=”yes”
在做web前端开发的时候,我们经常要用JavaScript获取页面的高度和宽度,但在不同的浏览器下获取的方法又不一样,或者说方法一样,但因为IE和FF对web标准的不同实现,同样的方法两浏览器得到的是不同的高度或者宽度。下面就对IE和FF中js获取页面高度与宽度做下对比:
1、window.screen.width/.height: 显示器大小(IE和FF通用)1440 * 900 –> 和浏览器是否全屏无关
2、document.documentElement.clientHeight /clientWidth: 浏览器可视窗口大小(IE和FF通用):该值不受样式表制约,只会随浏览器窗口大小变化。这和document.body.clientWidth 不一样。
3、document.body.clientHeight : 文档高度(IE和FF通用):和上面一样,只是取值对象改为BODY,当BODY中无内容时,IE下为18,FF为0.当有内容时,则IE值=FF值,此值和BODY中的内容有关,是所有元素高度的总和
4、document.body.clientWidth : 文档宽度(IE和FF通用,FF会比IE取得值多2PX左右):如IE 1440,FF:1442,此值和BODY中内容无关,但和样式有关,如在样式定义body{width:98px},则此值为98,当浏览器大小改变时,如不是全屏,此值也会跟着变化。 阅读全文…
我们经常看到很多网站都有自己的网站图标,如你打开百度或google的首页的时候,就可以看到在浏览器地址栏的最左侧看到很具有代表性的网站图标的。
网页图标,如果用英文来说就是Favorite’s Icon。它出现在浏览器地址栏左侧,可以通过它让浏览器的收藏夹除了显示网站的相应标题之外还可以以图标的形式来加以区别。根据浏览器的不同,这个图标的现实形式也有少许的不同。主流浏览器如FireFox、IE等等,网站图标不但在地址栏显示,也会显示在收藏夹中。这个图标除了可以美化作用之外,另外的一个副作用就是可以在一定程度上减轻服务器的流量,因为每次浏览器打开网站的时候都会默认的要访问这个图标文件,如果没有找到的话,网站就会返回一个404错误文件,并且在网站的错误日志中做记录,通过添加图标文件就可以避免这种情况。
给网站添加网站图标之前,我们得给自己的网站设计一个具有代表性图标,有在线生成网站图标工具的网站如:http://www.chami.com/html-kit/services/favicon/;当然,如果自己是搞设计的,自己设计一个那更好了,一般图标大小都是16×16,取名为favicon.ico,放到网站的某个目录下,为了在使网站显示自己设计的网站图标,之前我常用的是在页面的head部分中,添加一段描述代码,如<link rel=”shortcut icon” href=”/favicon.ico” type=”image/x-icon” />,这样加上以后在浏览器中打开这个页面,地址栏就会出现我们设计的图标。
其实还一种更简单的方法,就是将制作好的网站图标上传到网站的网页根目录,不用再在页面的head部分添加描述代码了,当然一定要保证的是,这个图标名字必须为favicon.ico,而且在网站的根目录。这样以后,只要浏览你的网站,这个图标始终会出现在地址栏以及标签页上面,收藏你的网站的之后,在收藏夹中也会显示。
在网上浏览了一通,看到一篇因为在页面里写了几条注释而使页面出现奇怪的现象,呵呵,之前还从来没想过在页面写注释也会给页面造成不小的麻烦,想不到IE还有这个Bug,摘抄如下:
<!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=gb2312" />
<title>多了一只猪</title>
</head>
<body>
<div style="width:400px">
<div style="float:left"></div>
<!-- -->
<div style="float:right;width:400px">↓这就是多出来的那只猪</div>
</div>
</body>
</html>
在IE下就会出现最后那个“猪”字回出现两次,下面摘抄淘宝前端牛人怿飞(http://www.planabc.net)对此的解释:
1、在 IE、Firefox 中测试,只在 IE 出现文字溢出现象。
说明:注释造成文字溢出是 IE 的 BUG 。
2、去除
中的“float:left;”,你会发现多出来的“猪”字不见了,页面正常显示。同样去除
中的“float:right;”,多余的“猪”字也同样消失,页面正常显示。
说明:注释造成文字溢出与区块的浮动有关。
3、将注释转移到
前面,多余的“猪”字消失,页面正常显示。将注释转移到
↓这就是多出来的那只猪
下面,多余的“猪”字也同样消失,页面正常显示。
说明:注释造成文字溢出与其位置有关。(可与第2点结合理解)
4、去除
中的“width:400px”,多余的“猪”字消失,页面正常显示。
说明:注释造成文字溢出与文字区块的固定宽度有关(无论是绝对值还是相对值)。
5、增加注释的条数:当1条注释时,则多出来 1 个字;2 条注释时,则多出来 3 个字;3 条注释时,则多出来 5 个字……
我们会从上面的规律中得到这样一个公式:溢出文字的字数=注释的条数 *2-1,这里的字数在中文或英文数字时都成立。
当溢出的文字字数大于文本的字数时,文字区块将会消失。
说明:溢出的字数与注释的条数有关。
由 1 和 2 的测试得知:注释不要放置于 2 个浮动的区块之间。
解决方法:
1、不放置注释。最简单、最快捷的解决方法,嘿嘿……
2、注释不要放置于 2 个浮动的区块之间。
3、将文字区块包含在新的
之间,如:
。
4、去除文字区块的固定宽度,与 3 有相似之处。
解决iframe自适应高度的办法很多中,这一个我认为是最简便的,呵呵:
<iframe src="http://www.joymood.cn/" frameBorder="0" width="100%" scrolling="no" allowTransparency="true" name="main" onload="this.height=main.document.body.scrollHeight"></iframe>
正则表达式在编程中用的很多,对于正则表达式的一些符号我们应该熟记,下面就是正则表达式符号一览表,里面对各个符号表达的意思都进行了描述:
web标准,对于做IT这行业的人来说,对这个术语都很熟悉,呵呵。但是自己还没有真正地去理解,下面摘抄一篇自己文章做纪念,呵呵。
转自于:http://www.w3cn.org/what/index.html
web标准,不是某一个标准,而是多个标准的集合,现在都流行结构和表现分离,这样易于管理,也易于维护。一个网页主要由结构、表现和行为三部分组成,那么它对应的标准也分三方面:结构化标准语言主要包括XHTML和XML,表现标准语言主要包括CSS,行为标准主要包括对象模型(如W3C DOM)、ECMAScript等。这些标准大部分由W3C起草和发布,也有一些是其他标准组织制订的标准,比如ECMA(European Computer Manufacturers Association)的ECMAScript标准。下面简单了解一下这些标准: 阅读全文…
Recent Comments