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. 基于DSP的IS95正向业务信道模块设计

    **定时20ms循环处理话音数据包*** *伪指令不占空间不影响执行速度,只是定义和描述但对汇编链接有重要指示作用 ********************************* .title & ...

  2. Burpsuite之Burp Collaborator模块介绍

    Burp Collaborator.是从Burp suite v1.6.15版本添加的新功能,它几乎是一种全新的渗透测试方法.Burp Collaborator.会渐渐支持blind XSS,SSRF ...

  3. IDAPython学习(二)

    1.常用函数 ScreenEA() 获取IDA调试窗口中,光标指向代码的地址.通过这个函数,我们就能够从一个已知的点运行我们的脚本. GetInputFileMD5() 返回IDA加载的二进制文件的M ...

  4. Docker(一)基本概念

    摘自 https://mp.weixin.qq.com/s/mcIMBMNMrFD9OE56iujhXQ 一.容器和虚拟机的比较 1.虚拟机 对于以前熟悉的虚拟机,我们需要模拟操作系统和硬件.虚拟机一 ...

  5. DWT在栅格数据嵌入不可见水印的应用

    1.1.1 嵌入水印 有意义的文字->二值图像->二值序列->置乱.加密->二值水印信息. 读取栅格数据,并进行M*M的分块处理,M为偶数.设分块区域,尺寸为偶数,满足DWT的 ...

  6. php函数:解决数组转对象时数组内中文乱码问题

    function to_urlencode(&$arr){//解决数组转对象时数组内中文乱码问题 foreach($arr as $key => $value){ if(is_array ...

  7. Ubuntu安装MongoDB

    一.下载安装 首先,更新软件包列表以获取最新版本的存储库列表: sudo apt update 2.接着安装MongoDB包本身: sudo apt install -y mongodb ×加-y是为 ...

  8. git 新建分支

    创建分支   git checkout -b 分支名 推送到远程   git push origin 分支名

  9. 常用linux命令总结

    Linux 版本 centos 1.查看Linux版本 uname -a 2.查看 ip 地址 ip addr 3.查看端口应用程序 netstat -lanp 如果输入上述命令,显示“-bash: ...

  10. 记录 一次深夜救火:datanode.data.dir

    火灾背景: Hadoop集群,4个节点,每一台配置都不一样 火灾现场: 1.突然发现DN4硬盘报警,检查硬盘,发现挂载如下: /home 200GB /home/data 3TB 然后发现datano ...