Javascript 偏移量总结
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
#div1 {
width: 100px;
height: 100px;
background: #000000;
padding: 50px;
border: 20px solid red;
margin: 30px;
}
</style>
</head>
<body>
<div id="div1"> </div>
<script src="../Script/jquery-2.1.1.js"></script>
<script type="text/javascript">
var oDiv = document.getElementById('div1');
oDiv.offsetHeight;//带border和带padding的高；
oDiv.clientHeight;//带padding，不带border的高
$("#div").height();//内容的高
$("#div1").innerHeight();//相当于clientHeight;
$("#div1").outerHeight();//相当于offsetHeight;
$("#div1").outerHeight(true);//相当于带margin，padding，border的 /*获取样式对象属性*/
var oStyle = getComputedStyle(oDiv, null);//获取所有的样式对象
//第一个参数是对象，第二个参数是获取哪一个，weinull就是所有的
console.log(oStyle.color);
console.log(oStyle.fontFamily);//IE6.7.8是不支持的
</script>
</body>
</html>
Javascript 偏移量总结的更多相关文章
- javascript 偏移量
通过四个属性可以获得元素的偏移量: 1.offsetHeight: 元素在垂直方向上占用的空间的大小,(像素).包括元素的高度,(可见的)水平滚动条的高度,上边框高度和下边框高度. 2.offsetW ...
- 掌握javascript中的最基础数据结构-----数组
这是一篇<数据结构与算法javascript描述>的读书笔记.主要梳理了关于数组的知识.部分内容及源码来自原作. 书中第一章介绍了如何配置javascript运行环境:javascript ...
- 纯javaScript、jQuery实现个性化图片轮播
纯javaScript实现个性化图片轮播 轮播原理说明<如上图所示>: 1. 画布部分(可视区域)属性说明:overflow:hidden使得超出画布部分隐藏或说不可见.position: ...
- JavaScript权威设计--JavaScript脚本化文档Document与CSS(简要学习笔记十五)
1.Document与Element和TEXT是Node的子类. Document:树形的根部节点 Element:HTML元素的节点 TEXT:文本节点 >>HtmlElement与 ...
- Javascript的二进制数据处理学习 ——nodejs环境和浏览器环境分别分析
以前用JavaScript主要是处理常规的数字.字符串.数组对象等数据,基本没有试过用JavaScript处理二进制数据块,最近的项目中涉及到这方面的东西,就花一段时间学了下这方面的API,在此总结一 ...
- 关于javascript的运动教程
一.javascript的匀速运动 关于物体的javascript匀速运动要点分析: 1.物体关于运动的时候,我们要打开定时器 2.打开定时器的时候我们记得要在停止的时候关闭定时器,同时应该注意的是一 ...
- JavaScript事件详解-Zepto的事件实现（二）【新增fastclick阅读笔记】
正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...
- javascript 百度地图API - demo
<!DOCTYPE html> <html> <head> <meta name="viewport" content="ini ...
- 两种JavaScript的AES加密方式（可与Java相互加解密）
由于JavaScript属于弱类型脚本语言,因此当其与强类型的后台语言进行数据交互时会产生各种问题,特别是加解密的操作.本人由于工作中遇到用js与Java进行相互加解密的问题,在网上查了很多资料及代码 ...
随机推荐
- iOS 数据库持久化
Java代码 -(void) addObserver{ //当程序进入后台时执行操作 UIApplication *app = [UIApplication sharedApplication]; [ ...
- [转]What’s Behind Ericsson’s OpenWebRTC Project?
[转]What’s Behind Ericsson’s OpenWebRTC Project? http://www.tuicool.com/articles/z6rAVrJ Ericsson’s O ...
- Win7下的本地网站发布
今天闲来无事研究了一下网站的发布,之前一直以为很难的样子,当真正实现了就觉得他也不过如此,现在来把我的研究结果分享一下,如果有问题望大家提出来! 首先发布网站我们要在本地的电脑上安装IIS,这个就不多 ...
- flask环境配置
1.首先要看装python环境,最好是python 2.7版本的: 2.安装easy_install,至今也不确定这个东西是怎么装的,我先下载了一个ez_setup,用命令“python ez_set ...
- Oracle Insert 多行（转）
1.一般的insert 操作. 使用语法insert into table_name[(column[,column...])] values (value[,value…])的insert语句,每条 ...
- 关于网站IIS日志分析搜索引擎爬虫说明
正文:iis默认的日志文件在C:\WINDOWS\system32\LogFiles中,下面是Seoer惜缘的服务器日志,通过查看,就可以了解搜索引擎蜘蛛爬行经过,如: 2008-08-19 00:0 ...
- linux打包压缩命令汇总
tar命令 [root@linux ~]# tar [-cxtzjvfpPN] 文件与目录 ....参数:-c :建立一个压缩文件的参数指令(create 的意思):-x :解开一个压缩文件的参数指令 ...
- WinForm-利用Anchor和Dock属性缩放控件
转自:http://www.cnblogs.com/tianzhiliang/articles/2144692.html 有一点让许多刚接触WinForms编程的开发者感到很棘手,就是在用户调整各种控 ...
- android编程常见问题- Resource ID #0x7f070001 type #0x12 is not valid
问题说明: AndroidRuntime(1705): java.lang.RuntimeException: Unable to start activity ComponentInfo{com.e ...
- IEEE 802.11 标准列表
IEEE 802.11 标准列表 IEEE 802.11,1997年,原始标准(2Mbit/s,播在2.4GHz). IEEE 802.11a,1999年,物理层补充(54Mbit/s,播在5GHz) ...