博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
11-12 元素的属性
阅读量:6878 次
发布时间:2019-06-26

本文共 1273 字,大约阅读时间需要 4 分钟。

函数封装:函数封装是一种函数的功能,它把一个程序员写的一个或者多个功能通过函数、类的方式封装起来,对外只提供一个简单的函数接口。当程序员在写程序的过程中需要执行同样的操作时,程序员(调用者)不需要写同样的函数来调用,直接可以从函数库里面调用

元素的属性:

  

  

Div.attributes 是所有标签属性构成的数据集合

Div.classList 是所有class名构成的数组集合

classList的原型链上看以看到add()remove()

 

1.client系列

  

 

  (1)  clientWidth/clientHeight 是我们设置的宽和高加上内边距(没有边框)

  clientLeft/clientTop 就是我们设置的边框值

2.Offset系列

   

  offsetWidth/offsetHeight 是我们设置的宽和高加上边框加上内边距

  offsetLeft/offsetTop 是元素外边距离父级的内边距的距离

  这个父级由定位position:absolute;

  offsetTop 参照物由父级元素身上的position:absolute/fixed决定的;如果父级元素没有就逐层向上查找直到body

  offsetParent  返回这个元素的父级元素

3.Scroll系列

 

  scrollWidth/scrollHeight 就是我们设置的宽高加上内边距(内容没有溢出的前提下)

  如果超出了范围就按内容而定

  scrollTop/scrollLeft   滚动条卷走的高度和宽度

  如果我们设置了小数,都会向上取整

 

案例分析

Offset 往往和我们做元素的运动有关

  1. offset必须和position配合使用往往这个值还必须是absolute
  2. offsetLeft 有初始值 在标准浏览器下是8px  低版本没有。
  1. Document.body 获取的是文档中的body标
  2. Document.documentElement  获取的是文档中根节点
  3. Document.body.clientWidth
  4. Document.documentElement.clientWidth

 

 二者获取的width的值不一样差16px,怎样让他们一样。

一个css就搞定了

Ie6不支持document.documentElement,

兼容性写法:Var w=document.documentElement.clientWidth||document.body.clientWidth获取浏览器可见区的宽度

 

逻辑运算 ||  &&  

   || 遇到第一个为真就返回

  && 遇到第一个为假就终止,返回false,如果没遇到就返回最后那一个

  5&&4&&2&&1  ==1

  5&&0&&3&&0  ==>0

  5||2&&3  且的优先级高于或  2&&3=3   5||3 ==5

 

转载于:https://www.cnblogs.com/wwwzhaocom/p/10043942.html

你可能感兴趣的文章
一切属他,则名为苦;一切由己,自在安乐。
查看>>
velocity 之坑:不同枚举类(enum)有相同的静态(static)方法,无法访问第二个枚举类...
查看>>
图的遍历方法(深度优先和广度优先算法)
查看>>
鸟巢-一种全新的Native APP开发模式,这篇文章为您解读
查看>>
shell批量查询IP
查看>>
快速生成移动设备应用图标的在线工具 - makeappicon
查看>>
学习linux决心书
查看>>
SVN服务的搭建
查看>>
ISO 9126质量模型:软件质量模型的6大特性和27个子特性
查看>>
一个 rm -rf的教训
查看>>
几何画板添加背景图片方法
查看>>
用main函数传参做简单的计算器的代码
查看>>
Bash终端命令行,使用privoxy将socks代理转成http代理
查看>>
Linux基础命令
查看>>
if case 语句 find locate 文件查找 和 压缩解压缩工具 简介
查看>>
Linux常用命令——tr
查看>>
检测 ip 是否断开,并使用邮箱报警
查看>>
整理第一周学习C的知识点
查看>>
Spring Data JPA 实例查询
查看>>
ping多线程
查看>>