标签存档: JavaScript - 第2页

document.documentElement和document.body

昨天在试.xhtml时,看网上说要得到<html>节点,在xhtml里要用document.documentElement,而在html 4里要用document.body,以前虽然知道它俩之间的区别,但还真没仔细注意过。结果我一试,不管是用xhtml还是html,不管是加DOCTYPE还是不加,document.documentElement总是<html>节点,document.body总是<body>节点。

这是咋回事呢?后来找了半天,在一个博客里看到,好像只有在IE 4以前的浏览器才认为document.body是<html>节点,具体怎样说的我也忘了,现在再找那个博客也找不到了。我也没有IE 6以前版本的浏览器,没法试,算了,就这样吧,谁还会用IE 6以前的浏览器呢?

所有的现代浏览器都认为document.documentElement可以得到<html>,document.body可以得到<body>。

不过我可没说在IE下,带DOCTYPE的文件和不带的,对documet.documentElement的解释是完全一样的。例如,我们要得到浏览器的显示区域大小,在带DOCTYPE的文件里,我们要用document.documentElement.clientWidth/document.documentElement.clientHeight来得到;而在不带DOCTYPE的文件里,这时documentElement.clientWidth/clientHeight都等于0,我们要用document.body.clientWidth/document.body.clientHeight来得到。

明白了吗?不明白的话,那咱就来点更糊涂的。

接着上面那个例子,我们现在通常使用的得到浏览器显示区域大小的函数通常可以简单的这样写:

<script type="text/javascript">
function documentHeight() {
  var de = document.documentElement;
  return window.innerHeight || ( de && de.clientHeight ) || document.body.clientHeight;
}

function documentWidth() {
  var de = document.documentElement;
  return window.innerWidth || ( de && de.clientWidth ) || document.body.clientWidth;
}
</script>

这里的window.innerWidth,document.documentElement.clientWidth,document.body.clientWidth都是啥意思呢?都是为了得到浏览器显示区域的宽,第一个是适用于非IE系的,第二个是适用于带有DOCTYPE的IE 浏览器的,第三个是适用于不带有DOCTYPE的IE 浏览器的。

怎么样?乱不?

感觉还行的话,还有更刺激的,加不加DOCTYPE,不同的浏览器,有没有设置margin,这么多种情况,排列组合一下,测试一下以上那三个值,绝对够你喝一壶的。

如果感觉乱,那就到此为止吧,我们按w3c那帮闲人的标准来,加上DOCTYPE。

使用eval生成JSON对象

我们假设通过var ret = xmlHttp.responseText 得到服务器端已经组装好的数据,在使用eval生成JSON对象时,一定要注意添加一对圆括号,例如:
var json = eval(‘(‘+ret+’)');

假设我们在服务器端使用php的encode_json()生成需要返回的字符串

如果生成的字符串是[{"name":"boke"},{"age":"23"}],我们可以直接使用eval([{"name":"boke"},{"age":"23"}])生成相应的JSON对象;

如果生成的字符串是{“name”:”boke”,”age”:”23″},我们使用eval({“name”:”boke”,”age”:”23″})生成JSON对象时就会出错,我们需要这样写eval(({“name”:”boke”,”age”:”23″}))。

eval(( ))的写法同样适用于包括第一种情况在内的其它通过encode_json()函数生成的字符串。