DOM对象

  DOM对象属性 对应css 说明 读/写
width   obj.clientWidth=20

1. 内联样式

<p style="width:20px"></p>

2. 内部/外部CSS

<style>
p{
width: 20px;
border: 0;
padding: 0;
}
</style>
<p></p>

在页面上返回内容的可视宽度

(内容+padding)

不包括边框,边距或滚动条

只读
obj.scrollWidth=20

1. 内联样式

2. 内部/外部CSS

子元素整个盒子宽度以及当前元素左侧padding值

(内容+padding)

只读
obj.offsetWidth=20

1. 内联样式

2. 内部/外部CSS

返回元素的宽度,

包括边框和填充

(内容+padding+border)

只读
obj.style.width="20px"  <p style="width:20px"></p>

在内联中定义才能读到值,否则为空

可写
obj.width   这个属性并没有  
height     与width一样   
top  obj.offsetTop=20   元素border外侧相对父元素border内侧垂直方向的偏移量 只读
obj.scrollTop=20  

overflow:scroll时会出现滚动条

当前内容的顶部相对原始内容顶部的距离

可写
obj.style.top="20px"  

在内联中定义才能读到值,否则为空

可写
left     与top一样   

Window窗口

  属性 说明
width window.innerWidth 窗口的文档显示区的宽度
window.outerWidth 窗口的外部宽度,包含工具条与滚动条
height   与width相似
left window.screenLeft 返回相对于屏幕窗口的x坐标
top   与left相似

event事件

纵坐标与横坐标类似,这里只列出横坐标

属性 说明
event.screenX

鼠标指针相对于电脑屏幕的水平坐标
event.clientX

鼠标指针向对于浏览器页面(或可见区域)的水平坐标

event.pageX

鼠标指针相对于整个文档的水平坐标

对象的宽度、top位置,x坐标属性的更多相关文章

  1. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  2. javascript:与获取鼠标位置有关的属性

    javascript并没有mouse对象,获取鼠标坐标要靠强大的event对象。 我们通过监听document的mousemove,就可以实时获得鼠标位置。 但是!!event中和鼠标相关的属性太多了 ...

  3. DataGridView自动保存列的宽度和位置

    WinForm程序中表单的自动保存列的宽度和位置,是一种常见的功能,对于用户体验来说是非常好的.现记录一下实现过程: 1.新建一个类,命为为:DataGridViewColumnStyle. 这个类实 ...

  4. matlab中subplot 在平铺位置创建坐标区

    来源:https://ww2.mathworks.cn/help/matlab/ref/subplot.html?searchHighlight=subplot&s_tid=doc_srcht ...

  5. 窗体位置设置StartPosition属性

    有如下选项,分别含义如下: CenterParent                    窗体在其父窗体中居中.      CenterScreen                    窗体在当前 ...

  6. 过程 sp_addextendedproperty, 对象无效。不允许有扩展属性,或对象不存在。

    过程 sp_addextendedproperty, 对象无效.不允许有扩展属性,或对象不存在. 首先这个是创建数据表的SQL,有Power Designer创建模型,直接生成的创建SQL会出现的问题 ...

  7. C#遍历XmlDocument对象所有节点名称、类型、属性(Attribute)

    C#遍历XmlDocument对象所有节点名称.类型.属性(Attribute) 源码下载 代码 static void Main(string[] args) { System.Xml.XmlDoc ...

  8. 消息 15135,级别 16,状态 8,过程 sp_addextendedproperty,对象无效。不允许有扩展属性,或对象不存在。

    不知道网上为啥有那么多复制粘贴的文章,写点原创不好吗?堂而皇之的贴别人的文章有意思吗? 消息 15135,级别 16,状态 8,过程 sp_addextendedproperty,对象无效.不允许有扩 ...

  9. JQuery 获得绝对,相对位置的坐标方法

    获取页面某一元素的绝对X,Y坐标,可以用offset()方法:(body属性设置margin :0;padding:0;) var X = $('#DivID').offset().top; var ...

随机推荐

  1. Linux或UNIX系统配置检查

    1. Linux或UNIX系统配置检查 系统配置的扫描是基于被动式策略进行扫描,主要检测主机上是否存在配置错误或者不符合预定义的安全策略的配置,通常需要管理员权限才能执行的扫描. 在Linux或UNI ...

  2. Chrome及Firefox插件

    注:以下所有工具都是笔者自己目前使用的 密码管理工具 lastpass 护眼工具 眼睛护航 待续……

  3. 初识生成器与生成器表达式 Day12

    一.生成器 1,生成器基本概念 生成器的实质是迭代器 迭代器:Iterator 内部同时包含了__iter__()和__next__()函数 可迭代对象:Iterable 内部包含__iter__() ...

  4. Java基础03-12_对象比较

    对象比较 如果说现在有两个数字要判断是否相等,可以使用"=="完成 如果是字符串要判断是否相等使用"equals()" 但是如果说现在有一个自定义的类,要想判断 ...

  5. git部分提交

    ---git add 需要提交的文件----git stash -u -k -k 开关告诉仓库保持文件的完整. -u 开关告诉仓库包括无路径的文件(那些新的和未添加到git的)----git stas ...

  6. 剑指Offer-第一个只出现一次的字符位置

    题目描述 在一个字符串(1<=字符串长度<=10000,全部由字母组成)中找到第一个只出现一次的字符,并返回它的位置 思路 思路一: 使用整型数组对出现次数进行统计. 思路二: 使用Bit ...

  7. C hashtable小例子

    参考链接:     http://blog.csdn.net/qinpanke/article/details/9171541

  8. Python 10 协程,异步IO,Paramiko

    本节内容 Gevent协程 异步IO Paramiko 携程 协程,又称为微线程,纤程(coroutine).是一种用户态的轻量级线程. 协程拥有自己的寄存器上下文和栈.协程调度切换时,将寄存器上下文 ...

  9. cookie——登录注册极简版

    本实例旨在最直观地说明如何利用cookie完成登录注册功能,忽略正则验证. index.html <!doctype html> <html lang="en"& ...

  10. android java 字符串正则表达式 分离特殊字符串

    Java中正则表达式的使用 在Java中,我们为了查找某个给定字符串中是否有需要查找的某个字符或者子字串.或者对字符串进行分割.或者对字符串一些字符进行替换/删除,一般会通过if-else.for 的 ...