正在查看: HTML/CSS/JavaScript 分类下的文章(第 1 页 / 共 5 篇)

使用XSLT进行日期格式转换

现在有个问题需要用XSLT来实现,那就是在XSLT中如何将一个日期结点的格式由YYYY-MM-DD转换到DD/MM/YYYY?

我首先想到的就是利用XSLT中的带参数的模板,将此原始日期作为参数参数一个模板中,然后进行重新组合。说起来晕乎乎,还是直接进入实战吧。

假设现在有一个XML文档,内容如下:

<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet type="text/xsl" href="format_date.xsl"?>
<notebooks>
 <notebook>
  <title>红花还需绿叶衬,我是标题一</title>
  <date>2009-08-11</date>
 </notebook>
 <notebook>
  <title>红花还需绿叶衬,我是标题二</title>
  <date>2009-08-10</date>
 </notebook>
</notebooks>

在这个文档中,结点的日期为2009-08-11,即格式为YYYY-MM-DD,现在我们需要利用XSLT将其转换成DD/MM/YYYY,也就是11/08/2009。

关于实现思路,我在上面已经讲到,不再赘述。这里讲讲具体实现,一个带参数的XSLT模板:

<xsl:template name="FormatDate">
 <!--Convert Old Date Format:yyyy-mm-dd to New Date Format: dd/mm/yyyy-->
 <xsl:param name="DateTime" />
 <xsl:variable name="y">
      <xsl:value-of select="substring($DateTime,1,4)" />
    </xsl:variable>
    <xsl:variable name="m_temp">
  <xsl:value-of select="substring-after($DateTime,'-')" />
 </xsl:variable>
    <xsl:variable name="m">
      <xsl:value-of select="substring($m_temp,1,2)" />
    </xsl:variable>
    <xsl:variable name="d_temp">
      <xsl:value-of select="substring-after($m_temp,'-')" />
    </xsl:variable>
    <xsl:variable name="d">
      <xsl:value-of select="substring($d_temp,1,2)" />
    </xsl:variable>
    <xsl:value-of select="$d"/>
    <xsl:value-of select="'/'"/>
    <xsl:value-of select="$m"/>
    <xsl:value-of select="'/'"/>
    <xsl:value-of select="$y"/>
</xsl:template>

如果对XSLT有所了解,相信上面的代码非常直观;如果不太了解,那么首先你应该去了解,或者在下面留言……

在XSLT中,我一直将模板当作其他程序语言中的函数。理解了这一点,上面这段程序就很好理解了,那个参数Datetime就像是程序语言中的入口参数,用来接受外部送给这个“函数”的参数。

需要注意的地方是,上面的19-23行,这是最后对日期各个部分(年、月、日)进行组合。换言之,你可以组合出任意你可以想出的日期格式,不限于此。

但这里只写了“函数”了部分,没有提到调用,调用方法如下:

<xsl:call-template name="FormatDate">
 <xsl:with-param name="DateTime" select="date"/>
</xsl:call-template>

在此例中,我将date这个结点的值传给了“函数”的参数。

完整的XSLT文件和最后的结果请分别这里这里

实例分析setTimeout和setInterval的区别

理解编程中某个对象、方法和属性的最好方法,莫过于通过不同实例对其进行验证。

在JavaScript中,setTimeoutsetInterval是window对象的两个不同方法;我们通常利用这两个方法来重复执行某个代码段或者function,以实现网页上的一些“动态”效果。

有意思的是,它们的用法几乎完全一样,都是:

setTimeOut(expression, timespan)

setInterval(expression, timespan)

第一个参数expression是需要调用的function;第二个参数timespan是指定延迟(等待)多少秒才调用参数一中的表达式,单位是微秒milliseconds。

既然这两个方法都是延迟一段时间后执行某个表达式,那么,它们的功能不就一样了吗?用我们的膝盖想想都应该知道,如果这两个方法的功能完全一样, ECMAScript开发组何不将他们合并成一个方法?

»阅读全文

Tags: javascript

Dirty Markup:一个在线精简修复网页文件的工具

Dirty Markup 是一个abeautifulsite推出的在线修复、整理网页文件的工具。

它能够自动修正一个网页文件中潜在的错误HTML或XHTML写法,同时规范化网页源文件布局;使其尽可能符合W3C规范,让一个网页文件最大限度的兼容多浏览器。

用一个例子来说明Dirty Markup的用法。

首先,我写了一个很简单的错误的HTML布局代码。

<div id=h> 
<font color=red><p>www.cnSaturn.com</p>
</font> 

以上HTML代码至少有两处错误:

  1. div标签未闭合
  2. 块级元素p被font标签所包含

以上HTML代码还至少有两处安全隐患会导致它在不同浏览器中表现不同:

  1. 不是一个完整的HTML文件
  2. 标签的属性对应的值未使用双引号

»阅读全文

Tags: html

防止AJAX动态结果在前端页面缓存的方法

在利用AJAX从后台程序提取数据,然后在前端页面显示出来的过程中,我们经常会碰到AJAX提取的数据被缓存,导致结果异常的问题。

具体原因是因为AJAX依赖于JavaScript,而浏览器会自动将JavaScript代码和文件数据缓存在客户端,这有利于用户下次访问时页面的快速下载和解析。

要解决数据被缓存,大概有两种做法。

第一种,是在客户端进行,在AJAX发送请求到后台数据处理页面的URL上加一个随机字符串 即可。这样一来,浏览器会认为AJAX发出的HTTP请求每次都不同(URL不同),从而每次都重新请求。具体做法如下:

xmlHttp.open("GET", "ajax.php?r="+new Date().getTime(), true);

既然是随机字符串,还可以使用:+math.random(),只要保持字符串随机即可。

另外一种是在服务器端进行。具体做法是修改HTTP头信息,手动设置让其过期。下面以PHP为例说明:

header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT"); // Date in the past
 header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT"); // always modified
 header ("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
 header ("Pragma: no-cache"); // HTTP/1.0

其他语言,比如ASP,J2EE,做法与此非常类似。

通常情况下,我们只需要选其以上两种方法的其中一种即可。

Tags: ajax,缓存

最简单去除UTF-8文件中BOM的方法

当你采用UTF-8格式作为网页编码时,如果发现网页在不同浏览器中外观表现不同,比如在Firefox中正常显示,但是在IE浏览器中出现多余的本不该出现的空行(通常在网页头部);此时你应该怀疑是BOM(Byte-Order Mark )在作祟了。当然,本文的前提是你的HTML和CSS代码均正确无疑。

志勇兄曾专门撰文提到过如何去掉UTF-8文件中BOM的方法。在这里,我想补充一个非常简单的办法——使用Notepad++去除文件中的BOM。

Notepad++是由一个台湾程序员开发的优秀的文本编辑器,也是我除了Editplus之外,非常喜欢的一款代码编写工具。它在处理文本格式方面应该算是诸多免费文本编辑器中最强的一个了。

言归正传,要去除存在UTF-8文件中的BOM,你只需要使用NotePad++打开这个文件,然后选择“格式”,再选择“以UTF-8无BOM格式编码”,最后重新保存文件即可!

使用Notepad++去除UTF-8文件中的BOM

本文的最后,我介绍一个小经验:

当大家在碰到网页解析上(包括CSS和HTML解析)的诸多奇怪问题(比如这个由BOM导致的奇怪空白行)时,切勿急躁,首先应该确定你的代码编写无误;如果问题仍然存在,将代码提交到W3C网站进行HTML验证CSS验证;最后根据验证结果的提示,更正自己的代码。尽量遵守W3C规范,按这个流程,一般问题都能得到解决。

Tags: bom,编码