不同的<!DOCTYPE>定义会影响到javascript的正常运行以及运行结果。
今天我在javascript中想取得一个当前网页可见区域的高度时发生一个问题:
不管我怎么缩放当前的窗口,取得的可见区域我值都是一样的,我在IE、Firefox上测试结果都一样。
我想起以前发现定义<!DOCTYPE>和不定义<!DOCTYPE>会影响到Javascript的运行,我就到百度搜索了一下,才发现我的猜测是正确的,果然在这两种情况下,想得到可见区域的方法是不一样的:
在来自IE6以后如果在页面顶上加了doctype后,一般是在获取clientWidth, clientHeight,offsetWidth, offsetHeight,scrollWidth, scrollHeight,scrollTop, scrollLeft会返回不正确的值。
因为在加了doctype后,在ie6中这些document.body的属性已经重新分配给了document.documentElement
比如:原来document.body.clientHeight,就要改成document.documentElement.clientHeight
为了自适应,可以改了下代码:
var height = document.documentElement.clientHeight==0?document.body.clientHeight:document.documentElement.clientHeight
分享到:
相关推荐
当然对JS的取值也会有影响。 DOCTYPE声明如下:<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> DOCTYPE声明包括:过渡型...
原生JavaScript实现简单五子棋游戏 本文实例为大家分享了JavaScript实现简单五子棋游戏的具体代码,供大家参考,具体内容如下 HTML页面 注释都很明确了,大家好好学习。 <!DOCTYPE ...
本文实例为大家分享了JavaScript代码实现简单计算器的具体代码,供大家参考,具体内容如下 (1)利用css样式、javascript语言和html语言实现计算器的算法 (2)对计算器的页面进行规划以及对界面进行颜色的填涂 ...
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <!-- saved from url=(0025)http://js.wanxu.com/myjs/ --> <HTML><HEAD>网页特效集锦(js.wanxu.com ) ; charset=gb2312"> content="java, ...
javascript以下是javascript中的数组定义形式: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> ; charset=GBK"> <title>Untitled Document ...
不同的渲染模式会影响到浏览器对于 CSS 代码甚至 JavaScript 脚本的解析,所以Doctype是非常关键的,尤其是在 IE 系列浏览器中,由DOCTYPE 所决定的 HTML 页面的渲染模式至关重要。 两种渲染模式: BackCompat:...
JavaScript实现筛选数组 本文实例为大家分享了JavaScript实现筛选数组的具体代码,供大家参考,具体内容如下 今天,运用JavaScript的相关知识,制作了筛选数组的案例。希望我们互相学习,共同进步! 最终效果图...
本文实例讲述了javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果。分享给大家供大家参考。具体如下: 下面的玫瑰绘制用到了HTML 5的canvas,所以你的浏览器需要支持HTML 5。个人还是比较推荐chrome,这个效果在...
javascript实现编写网页版计算器 本篇主要记录的是利用javscript实现一个网页计算器的效果,供大家参考,具体内容如下 话不多说,代码如下: 首先是html的代码: <!DOCTYPE ...
javascript实现前端分页功能 前言:今天给大家带来的是前端数据的分页功能,供大家参考,具体内容如下 先上一波效果图展示: 直接上代码:这里使用的是JavaScript来实现 关于代码详解都以注释的方式写在...
原生JavaScript实现购物车 本文实例为大家分享了JavaScript实现购物车的具体代码,供大家参考,具体内容如下 效果: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title>...
然后当用户评论时,空评论不能评论,发布的评论将会最新显示,把旧的评论抵下去,然后博主可以对评论进行删除 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>...
本文实例讲述了javascript设置页面背景色及背景图片的方法。分享给大家供大家参考,具体如下: <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.0 Transitional//EN> <HTML> <HEAD> <TITLE> New ...
JavaScript快速实现日历效果 本文实例为大家分享了JavaScript快速实现日历效果的具体代码,供大家参考,具体内容如下 效果图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> ...
JavaScript实现滚动加载更多 本文实例为大家分享了JavaScript实现滚动加载更多的具体代码,供大家参考,具体内容如下 vscode index: <!DOCTYPE html> <html lang="en"> <head> ...
DOCTYPE html> <html> <head><title>贪吃蛇</title> </head> <body> <canvas id="canvas" width="400" height="400"></canvas> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js">...
javascript canvas实现雨滴效果 本文实例为大家分享了javascript canvas实现雨滴效果的具体代码,供大家参考,具体内容如下 先看效果 看起来很炫酷,其实就是实现了雨滴的掉落还有最后的圆 还是看源码 <!...
Javascript实现简易导航栏 本文实例为大家分享了Javascript实现简易导航栏的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> , initial-scale=...
javascript实现下拉菜单效果 用Javascript实现下拉菜单,供大家参考,具体内容如下 正在学习大前端中,有代码和思路不规范不正确的地方往多多包涵,感谢指教 下拉菜单,或者侧拉菜单在实际开发当中非常的实用 ...