http 405 错误

2012年8月2日 没有评论

在进行ajax调用时,测试js逻辑时把请求地址随便指定为http://www.baidu.com,结果调用没有任何返回,通过查看请求,发现请求的状态码为405。第一次接触到这个,在网上找了一下,原来是大部分的web服务器都不允许静态静态页面响应POST请求,否则就会返回“HTTP/1.1 405 Method not allowed”错误。刚好我的ajax请求方式使用的POST,所有就出错,也就没有任何返回信息。

yslow无法正常工作

2012年8月2日 1 条评论

Yslow是yahoo开发的一个firefox插件,用于页面的性能分析,提供一些优化意见,帮助优化页面。其中还有一项功能我很喜欢,就是能把页面的所有js都显示出来,而且是美化的。因为现在很多网站都是使用压缩后的js,而且一个页面加载几个到十几个,如果逐个去分析确实是一件难事,当使用Yslow把所有的js都显示一个页面后,可以通过查找方式快速来获取有用的信息。

Yslow一直都是配合这firebug插件一起使用的,这段时间换了系统,只装了最新的Firefox和firebug插件,刚好遇到一个问题,需要分析页面的js,就想到Yslow,安装一切顺利,但是重启浏览器后,firebug里面没有出现Yslow,折腾好久也没有搞定,开始还以为是mac系统下不能正常功能,然后在虚拟机的win xp安装最新的Firefox、firebug及yslow,结果一样不能工作。

只好求助google,一顿狂搜,终于在mozilla官网上找到了结果,原来是由于firebug跟Yslow不兼容造成的,链接地址:http://mozilla.com.cn/post/16305/。经过测试firebug 1.7.3以上的版本都不能使用Yslow,1.7.3还能正常使用,不过firefox 14下这个版本firebug似乎有些功能又不能用。所以为了使用Yslow只能下载一个低版本的firebug凑合,使用完了再升级firebug。希望它们早日解决兼容性问题。

禁止页面缓存

2012年7月29日 没有评论

要想控制页面不缓存,无非是从过期时间、页面的最后更新时间以及Cache-Control来入手。只要在响应的header信息中正确设置了这些信息就能到达页面不缓存的目的。例如在php中通过header函数来设置页面不缓存:

header( 'Expires: Sat, 26 Jul 1997 05:00:00 GMT' ); 
header( 'Last-Modified: ' . gmdate( 'D, d M Y H:i:s' ) . ' GMT' ); 
header( 'Cache-Control: no-store, no-cache, must-revalidate' ); 
header( 'Cache-Control: post-check=0, pre-check=0', FALSE ); 
header( 'Pragma: no-cache' );

说明:
Expires(过期时间)只要设置成一个过去的时间即可;

Last-Modified(页面最后更新时间)设置为当前时间,让浏览器获取最新的页面资料;

第一个Cache-Control,告诉浏览器不要缓存当前页面,针对HTTP 1.1 协议

第二个Cache-Control主要是针对古老的IE 5

Pragma: no-cache针对HTTP 1.0 协议告诉浏览器不要

使用运算符 -= 的陷阱

2012年7月28日 没有评论

一般的编程语言中都提供了+=、-=这样的运算符,例如

var para = 1;
para = para + 4;
//等价于
para += 4;

//同样
para = para - 4;
//等价于
para -= 4;

我的编程习惯一直比较倾向后者,最近在写php代码时候发现了一个小陷阱,如下代码:

$cnt = 100;
$offset1 = 80;
$offset2 = 120;

$cnt -= $offset1 + $offset2;

我的原意是$cnt – $offset1 + $offset2,结果为140,但是真实的结果是-100。这也是典型运算符优先级导致的问题,原来 + 的优先级要高于 -=,所以自然结果就是-100了。经测试java、php、javascript、python都是这样。

使用 +=、-= 时如果超过两个操作数,一定要清楚到底在做什么,特别要注意运算符的优先级。

平时我是记不住那么多运算符的优先级顺序,在处理多个参数进行混合运算时都是祭出法宝,那就是使用括号来控制优先级。

分类: web前端 标签:

zend studio — Invalid character used in text string

2012年4月26日 没有评论

使用zend studio 写php时候,看到项目中有很多类似“Invalid character used in text string”的警告,造成警告的原因是Validation,去掉这个警告的办法为:打开偏好设置,找到Validation项目,在右边选项中把“HTML Syntax Validator(for PHP Files)”对于的勾去掉,即不针对PHP文件做html语法检验。

分类: web前端 标签:

js中三个等于号

2012年4月16日 没有评论

有时候会看到在判断两个对象是否相等的时候使用了三个等号(===),它和两个等号(==)有什么区别呢?简单来说就是使用“==”时,如果两边类型不同,js引擎会把它们转换成相同类型然后在进行比较,而“===”则不会进行类型转换,因此当两边不是属于同一个类型,肯定不相等。例如:

var a = 0, b = '0';

alert((a == b) + '--' + (a === b))

此时看到的结果为“true–false”。

=== 判断规则

  1. 如果类型不同,就[不相等]
  2. 如果两个都是数值,并且是同一个值,那么[相等];(!例外)的是,如果其中至少一个是NaN,那么[不相等]。(判断一个值是否是NaN,只能用isNaN()来判断)
  3. 如果两个都是字符串,每个位置的字符都一样,那么[相等];否则[不相等]。
  4. 如果两个值都是true,或者都是false,那么[相等]。
  5. 如果两个值都引用同一个对象或函数,那么[相等];否则[不相等]。
  6. 如果两个值都是null,或者都是undefined,那么[相等]。

== 判断规则:

  1. 如果两个值类型相同,进行 === 比较。
  2. 如果两个值类型不同,他们可能相等。根据下面规则进行类型转换再比较:
  • 如果一个是null、一个是undefined,那么[相等]。
  • 如果一个是字符串,一个是数值,把字符串转换成数值再进行比较。
  • 如果任一值是 true,把它转换成 1 再比较;如果任一值是 false,把它转换成 0 再比较。
  • 如果一个是对象,另一个是数值或字符串,把对象转换成基础类型的值再比较。对象转换成基础类型,利用它的toString或者valueOf方法。js核心内置类,会尝试valueOf先于toString;例外的是Date,Date利用的是toString转换。非js核心的对象,令说(比较麻烦,我也不大懂)
  • 任何其他组合,都[不相等]。

特别需要注意的是true、false的转换,例如:

alert(true == 1);  //ture
alert(true == 2); //false, true会转换成number,也就是1,当然 1 不等于 2
//可以使用 !! 来把一个数据类型转换为boolean型 
alert(true == !!2) //true,!2 === false !(!=2) = !false = true

另外在js中,如果把一个变量用在逻辑运算中,那么变量在无初始值或者其值为 0、-0、null、”"、false、undefined 或者 NaN时,它的值为 false。否则,其值为 true。

js arguments.callee一些用途

2012年4月16日 没有评论

arguments.callee表示引用当前正在执行的函数,或者说是调用arguments.callee的函数对象的引用,它给匿名函数提供了一种自我引用的方式。通过如下例子,可以更好的理解概念。

var func = function() {
    alert(func === arguments.callee);
}

func();

执行上述代码,可以看到alter出来的结果是true,注意,此处用的是“===”,就是说func与arguments.callee对象类型和值都相等。

上面讲了arguments.callee的定义,那么它用在什么场合呢?一般来说,它会和匿名函数一起结合来用。
例如js脚本当前等待页面某种条件是否满足,如果满足进行相应初始化处理,但不是一直等下去,超过一定时间就放弃等待

var flag = false, start = (new Date()).getTime();

//普通实现 1
function fun1() {
    //flag状态会在其他地方修改,当满足条件后执行相应逻辑
    if (flag) {
        // do something
        return;
    }
    
    //超过等待时间,放弃
    if ((new Date()).getTime() - start > 3000) {
        return;
    }
    
    //等待一秒后重试
    setTimeout(fun1, 1000);
}

fun1();

//普通实现 2
function fun2() {
    if (flag) {
        // do something
        clearInterval(handler);
        return;
    }
    
    if ((new Date()).getTime() - start > 3000) {
        clearInterval(handler);
        return;
    }
}

var handler = setInterval(func2, 1000);

//匿名函数实现
(function(){
    if (flag) {
        // do something
        return;
    }
    
    if ((new Date()).getTime() - start > 3000) {
        return;
    }
    
    setTimeout(arguments.callee, 1000);
})();

比如执行初始化操作,使用匿名函数的好处是确保只被执行一次,而前面两种实现,由于定义了函数,就有可能在别处被误调用,从而执行多次初始化。

再看一递归调用例子:求一个数的阶乘

//普通实现
function fun2(n) {
    if (n > 1) {
        return n * fun2(n -1);
    }
    
    return 1;
}

var r1 = fun2(3);

//使用匿名函数
var  r2 = (function(n) {
    if (n > 1) {
        return n * arguments.callee(n -1);
    }
    
    return 1;    
})(3);
分类: web前端 标签:

document.domain用途

2012年4月15日 2 条评论

在上一篇文章:iframe父子页面相互调用js方法中通过例子介绍了iframe与其父页面进行js的通信,但是这里有一个非常重要的限制,由于浏览器基于安全考虑,是不允许js在不同域名间进行通信,所以父子页面必须属于同一个域,即使是相同主域下的不同二级域也是不行的。

对于父子页面完全属于两个不同的域名,那么它们之间永远无法直接进行通信;如果父子页面是属于同一个主域下的不同二级域,则可以使用强制设置document.domain的方式来达到让其互相通信。document.domain默认值是window.location.host,可以js中设置为window.location.host的上一级域,但是不能为根域,例如:可以在页面www.netingcn.com设置document.domain为netingcn.com,但是不能设置为other.netingcn.com或com。

document.domain在一定程度上解决了不同二级域名页面的跨域问题。需要注意的是,如果父页面包含多个iframe且设置了document.domain,那么要与其进行通信的iframe也必须设置document.domain。另外在chrome 18中,父子页面属于相同域名,当设置document.domain后,它们之间变的无法通信了,其他浏览器正常。

分类: web前端 标签:

iframe父子页面相互调用js方法

2012年4月15日 没有评论

当父页面和子页面都属于同一个域下,那么它们之间js方法是可以相互调用的。在调用方法前指定function所属对象即可,父页面获取iframe所属对象方法为:iframe的name.window,iframe页面获取父页面的对象为parent的。具体例子如下:

父页面:parent.html

<!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=utf-8" />
<title>parent</title>
<script>
	function parentFunction() {
		alert('function in parent');
	}

	function callChild() {
		child.window.childFunction();
		/*
			child 为iframe的name属性值,
			不能为id,因为在FireFox下id不能获取iframe对象
		*/
	}
</script>
</head>
<body>
<input type="button" name="call child"  value="call child" onclick="callChild()"/>
<br/><br/>
<iframe name="child" src="./child.html" ></iframe>
</body>
</html>

子页面:child.html

<!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=utf-8" />
<title>child</title>
<script>
	function childFunction() {
		alert('function in child');
	}

	function callParent() {
		parent.parentFunction();
	}
</script>
</head>
<body>
<input type="button" name="call parent" value="call parent" onclick="callParent()"/>
</body>
</html>

firefox httpfox 插件替代IE httpwatch

2012年4月13日 没有评论

httpwacth一款强大的网页数据分析工具,window下集成在IE的工具栏中,包括网页摘要.Cookies管理.缓存管理.消息头发送/接受.字符查询.POST 数据和目录管理等功能,似乎现在的版本也能集成在window下的firefox里。这些功能在firefox里的firebug插件也同样实现了。httpwatch还有一个强大的过滤功能,firebug似乎没有,有了这个功能,可以在茫茫多的请求中找到自己关心的请求,例如加载某个网页可能会请求10几个域下的资源,而我们可能只关心某个域下,这个只需要通过域名过滤即可。反观firebug的搜索就做的太差了。

有一个小小遗憾,httpwatch只有window版本,mac下没有,官方网站有明确的说明,还推荐使用虚拟机的方式来使用它。算好firefox下有一个插件httpfox可以替代httpwatch,其功能虽说没有httpwatch那么强大,但是也够用了,好处是window,mac下都只有装了firefox就都能用。

httpfox的官方地址是:https://addons.mozilla.org/zh-cn/firefox/addon/httpfox/,安装很容易,装好后它位于 工具 –> Web 开发者 –> HttpFox。

无觅相关文章插件,快速提升流量