js和jq获取宽度和高度
Javascript:
console.log(document.body.clientWidth); //网页可见区域宽(body)
console.log(document.body.clientHeight); //网页可见区域高(body)
console.log(document.body.offsetWidth); //网页可见区域宽(body),包括border、margin等
console.log(document.body.offsetHeight); //网页可见区域宽(body),包括border、margin等
console.log(document.body.scrollWidth); //网页正文全文宽,包括有滚动条时的未见区域
console.log(document.body.scrollHeight); //网页正文全文高,包括有滚动条时的未见区域
console.log(document.body.scrollTop); //网页被卷去的Top(滚动条)
console.log(document.body.scrollLeft); //网页被卷去的Left(滚动条)
console.log(window.screenTop); //浏览器距离Top
console.log(window.screenLeft); //浏览器距离Left
console.log(window.screen.height); //屏幕分辨率的高
console.log(window.screen.width); //屏幕分辨率的宽
console.log(window.screen.availHeight); //屏幕可用工作区的高
console.log(window.screen.availWidth); //屏幕可用工作区的宽
Jquery:
console.log($(window).height()); //浏览器当前窗口可视区域高度
console.log($(document).height()); //浏览器当前窗口文档的高度
console.log($(document.body).height()); //浏览器当前窗口文档body的高度
console.log($(document.body).outerHeight(true)); //浏览器当前窗口文档body的总高度 包括border padding margin
console.log($(window).width()); //浏览器当前窗口可视区域宽度
console.log($(document).width()); //浏览器当前窗口文档对象宽度
console.log($(document.body).width()); //浏览器当前窗口文档body的宽度
console.log($(document.body).outerWidth(true)); //浏览器当前窗口文档body的总宽度 包括border padding margin
js和jq获取宽度和高度的更多相关文章
- 原生JS 和 JQ 获取滚动条的高度,以及距离顶部的高度
JQ:相对比较简便 获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 ...
- Js与Jq 获取浏览器和对象值的方法
JS and Jquery 都能获取页面元素的宽度,高度和相对位移等数值,那他们之间能相互转换或替代吗,写法又有哪些差异呢?本文将详细为你介绍. 1.Js获取浏览器高度和宽度document.docu ...
- 关于JQuery获取宽度和高度在chrome和IE下的不同
之前写了一个关于滚动条的东西,可是在写的时候发现JQuery在获取宽度和高度时在不同浏览器中是不一样的,下面发一下代码给给位看官先展示一下: $(function(){ $("#main&q ...
- js模拟jq获取id
js模拟jq获取id: (jquery)需要自己添加 <!DOCTYPE html> <html lang="en"> <head> <m ...
- 原生JS与JQ获取元素的区别
刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...
- js、jq获取屏幕宽高
参考资料 JS,Jquery获取各种屏幕的宽度和高度
- js,jq获取父,兄弟,子节点整理
js获取节点 父: parentNode 获取已知节点的父节点. 子: childNodes; 得到全部子节点 children 得到全部子节点 firstChild 获得第一个子节点 lastChi ...
- js和jq获取父,兄弟,子节点
1,js获取节点: 父: parentNode 获取已知节点的父节点. 子: childNodes; 得到全部子节点 children 得到全部子节点 firstChild 获得第一个子节点 last ...
- JS与JQ 获取页面元素值的方法和差异对比
获取浏览器高度和宽度 document.documentElement.clientWidth ==> 浏览器可见区域宽度 document.documentElement.clientHeig ...
随机推荐
- Linux 内存监控
1.按照内存使用方式排序 top 之后使用 shift + m 那么top按照内存使用从大到小进行排列,使用 shift + P 表示按照CPU进行排序. bigfish 1118m 438m 30m ...
- C#找出接口的所有实现类并遍历执行这些类的公共方法
//这里找出了实现IOutputArray接口的所有类 private void FindAllClass() { var types = AppDomain.CurrentDomain.GetAss ...
- MySql 的操作日志 历史记录
如何查看mysql数据库操作记录日志 1.首先确认你日志是否启用了mysql>show variables like 'log_bin'. 2.如果启用了,即ON,那日志文件就在mysql的安装 ...
- Navicat 导出sql文件和导入sql文件
1.导出sql文件 (1)选择需要导出数据库表,右击--->转储为sql文件---->结构和数据 (2)会弹出如下界面,采用默认的数据表名,点击确认即可. 2.导入sql文件 (1)点击表 ...
- python学习,day3: 文件的读写
# coding=utf-8 # Author: RyAn Bi import sys f1 = open('yesterday2',mode='w',encoding='utf-8') #w 只能写 ...
- 基础篇:6.1)形位公差-要素 Feature
本章目的:理解形位公差研究的对象-要素,即点.线.面. 1.定义 2.类型 2.1 按存在的状态分 2.2 按结构特征分 2.3 按所处的地位分 2.4 按结构性能分 2.5 按与尺寸关系分
- find命令用法集锦
find命令用法: 01--过滤日志find -name "catelina.*.out"|xargs -f |grep '关键字' 02 -忽略一个目录或者多个目录find ./ ...
- native excel 文件已经打开的判断
book := TXLSWorkbook.Create; try then begin raise Exception.Create('请检查导入的文件是否存在或Excel已经处于打开状态(如果已经打 ...
- Vue.js 项目开发学习路线图
1. 思维导图 源文件:Vue路线图.xmind 参考文献 [1]. VueJs2.0建议学习路线 - lavyun - 博客园 [2]. Vue学习路线图 - 个人文章 - SegmentFault ...
- CDH集群安装配置(六)CDH agent
在线安装 sudo yum install cloudera-manager-agent cloudera-manager-daemons 离线安装 上传三个server的资源包到cdh1节点上(所有 ...