js 获取 客户区 大小
js 获取 客户区 大小
本文内容来自《javascript高级程序设计(第二版)》 内容, 只是方便大家以后可能会用到...
- <script type="text/javascript">
- function getClientPoint()
- {
- if(document.compatMode=="BackCompat")
- {
- return {
- width:document.body.clientWidth,
- height:document.body.clientHeight
- };
- }else
- {
- return {
- width:document.documentElement.clientWidth,
- height:document.documentElement.clientHeight
- };
- }
- }
- var point=getClientPoint();
- alert(point.width+"__"+point.height)
- </script>
document.compatMode 确定浏览器处于什么模式:
BackCompat:标准兼容模式关闭(混杂模式)。
CSS1Compat:标准兼容模式开启。
也就是说在获取客户区大小的时候通过判断浏览器处于一个什么模式,如果是在混杂模式里面,通过document.body获取
否则,通过document.documentElement来获取
在Safari3.1之前的版本里面不支持这个属性, 所以同样走的是 else , 这样就返回一个包含width和height属性的对象.
注意:这些属性都是只读的,而且每次访问的时候,都需要重新计算,
因此,应该尽量避免重复访问这些属性,如果需要重复使用这些属性,可以通过缓存的方式来保存(保存在局部变量里面),以便提高性能,同时还有像
offsetTop,offsetLeft,offsetWidth,offsetHeight等偏移量属性,均是只读属性,都应该尽可能避免重复访问这
些属性!
js 获取 客户区 大小的更多相关文章
- 一文看懂js中元素的客户区大小(clientWidth,clientHeight)
元素的客户区 元素的客户区大小,指的是元素内容及其内边距所占据的空间大小. 相关属性如下: 1. clientWidth:元素内容区宽度+元素左右内边距 2. clientHeight:元素内容区高度 ...
- 元素大小-偏移量(offset)客户区大小(client)滚动大小(scroll)
一.偏移量---offset 1.定位父级 在理解偏移大小之前,首先要理解offsetParent.人们并没有把offsetParent翻译为偏移父级,而是翻译成定位父级,很大原因是offsetPar ...
- (转)JS获取当前对象大小以及屏幕分辨率等
原文 JS获取当前对象大小以及屏幕分辨率等 <script type="text/javascript">function getInfo(){ var ...
- JS获取当前对象大小以及屏幕分辨率等...
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta nam ...
- 【Javascript Demo】JS获取当前对象大小以及屏幕分辨率等
效果如下: 代码如下: <html> <head> <title>获取当前对象大小以及屏幕分辨率等</title> <body> <d ...
- 【全面总结】js获取元素位置大小
[js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...
- js获取图片原始大小
摘要: 浏览器中显示的图片大小未必是他真实的高和宽,比如像下面这样,我们给他加上宽和高的样式 <img src="IE.png" style="width:25px ...
- JS获取元素尺寸大小、鼠标位置
//e.clientX|Y:表示鼠标相对浏览器可视窗口的当前坐标 //e.offsetX|Y:表示鼠标相对于事件源对象的坐标 //e.pageX|Y:表示鼠标相对于网页的坐标 /* element.o ...
- (转)JS获取当前对象大小以及屏幕分辨率等
Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--> ...
随机推荐
- C#设置图片透明度
逐个像素进行Alpha值的设置,网上其他的代码不能处理有透明背景的图片,因此要对Alpha.R.G.B均为0的透明色进行特殊处理,不做转换. private Bitmap SetImageOpacit ...
- BZOJ 1562 [NOI2009] 变换序列
[NOI2009] 变换序列 [题解] 就是有一个序列,每个位置可以填两个数,不可重复,问最小字典序. 显然,可以建一个二分图,判合法就是找完美匹配. 那怎么弄最小字典序呢?有好多种解法,我这里给出了 ...
- 【题解】 LA3708 Graveyard
题目大意 在一个圆周长为10000的圆上等距离分布n个雕塑,现在有m个新加入的雕塑(还是要求等距离摆放),问n个雕塑移动的总距离的最小值. Solution 显然必然会有一个雕塑不移动,所以可以直接不 ...
- OCP 11g认证052考试最新题库(带答案)-带38题
38.Which three are true about the Automatic Database Diagnostic Monitor (ADDM)? A) Its findings are ...
- 一个标准的AJAX请求
这是一个标准的ajax请求: $.ajax({ type:"post", url:basePath+"/resourcePush/operationLog", ...
- Connection Timeout和Command Timeout
每次对数据库连接时,我们有时候会碰到连接超时或者命令超时,这两个超时是不一样的.以ADO.NET为例,当客户端和服务器端连接时,碰到的超时情况主要有下面几种: 当从连接池获取一个连接时,碰到超时. 当 ...
- [转] Linux 硬件设备查看命令
linux查看设备命令 系统 # uname -a # 查看内核/操作系统/CPU信息 # head -n 1 /etc/issue # 查看操作系统版本 # cat /proc/cpuinfo # ...
- 你不可不知的数据库northwind
说起northwind,40左右的大年一定不会陌生,它是著名的northwind示例库,在SQL Server 是标配. 它有8张表,涉及客户.商品.订单. 如果你是有志从事企业级应用开发,或有志从事 ...
- 2016级算法第一次练习赛-B.朴素的中位数
朴素的中位数 题目链接:https://buaacoding.cn/problem/846/index 分析 题意很简单,就是给定了两个从小到大排好序的数组,找出这两个数组合起来的数据中的中位数. 方 ...
- docker搭建tomcat环境
1.拉取镜像 docker pull tomcat 2.运行容器 docker run --name tomcat -p : -v /data/tomcat/test:/usr/local/tomca ...