11前端基本功网页特效101前端基本功js第八天

《11前端基本功网页特效101前端基本功js第八天》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、前端基本功—javascript第八天目录目录21.2复习31.3offset家族31.3.1offsetWidthoffsetHeight41.3.2offsetLeftoffsetTop41.3.3offsetParent61.3.4offsetTopstyle.top的区别61.4事件对象71.4.1event常见属性81.4.2pageXclientXscreenX区别91.5常用事件10复习1.根据位置返回字符asdfg.charAt(3)f根据字符返回位置asdfgg.indexOf(“f”)3从前面索引lastIndexOf(“g”

2、)5从后面索引2.slice(起始位置，[结束位置])slice(3)从第3个开始选slice(3,6)从索引号3开始取，数6个但是从索引号0开始数vararr=[1,3,5,7];asdfghidkfghsubstr(3,6)从3开始选从第三个开始数往后数6个fghidktoFixed(2)toFixed()方法可把Number四舍五入为指定小数位数的数字。varnum=newNumber(13.37);document.write(num.toFixed(1))13

3、.4缓动公式:leader=leader+(target-leader)/101.1offset家族offset自己的目的：js中有一套方便的获取元素尺寸的办法就是offset家族；http://blog.sina.com.cn/s/blog_63426ff90100m8c3.html1.1.1offsetWidthoffsetHeight得到对象的宽度和高度(自己的，与他人无关)offsetWidth=width+border+paddingdiv{width:220px;border-left:2pxsolidred;padding:10px

4、;}div.offsetWidth=220+2+20为什么不用div.style.width因为东西只能得到行内的数值1.1.1offsetLeftoffsetTop返回距离上级盒子（最近的带有定位相对绝对都可以）左边的位置如果父级都没有定位则以body为准这里的父级指的是所有上一级不仅仅指的是父亲还可以是爷爷曾爷爷曾曾爷爷。。。。offsetLeft从父级的padding开始算父亲的border不算总结一下：就是子盒子到定位的父盒子边框到边框的距离1.1.1offsetParent返回该对象的父级（带有定位）不一定是亲的爸爸前面学过一个返回父亲

5、(亲的)parentNode有所区别如果当前元素的父级元素没有进行CSS定位（position为absolute或relative），offsetParent为body。2、如果当前元素的父级元素中有CSS定位（position为absolute或relative），offsetParent取最近的那个父级元素。varson=document.getElementById("son");//alert(son.parentNode.id);alert(son.offsetParent.tagName);//tagName标签的名字1.1.1off

6、setTopstyle.top的区别一、最大区别在于offsetLeft可以返回没有定位盒子的距离左侧的位置。而style.top不可以只有定位的盒子才有lefttoprightbottom二、offsetTop返回的是数字，而style.top返回的是字符串，除了数字外还带有单位：px。style.left=300pxparseInt（300px）结果300parseInt（style.left）+parseInt（style.left）三、offsetTop只读，而style.top可读写。四、如果没有给HTML元素指定过top样式，则sty

7、le.top返回的是空字符串。五、最重要的区别style.left只能得到行内样式offsetLeft随便1.2事件对象我们学过一些事件:onmouseoveronmouseoutonclick.....btn.onclick=function(event){语句}event单词翻译过来事件的意思event就是事件的对象指向的是事件是onclick再触发DOM上的某个事件时，会产生一个事件对象event，这个对象中包含着所有与事件有关的信息。所有浏览器都支持event对象，但支持的方式不同。比如鼠标操作时候，会添加鼠标位置的相关信息到事件对象中。

8、普通浏览器支持eventie678支持window.event所以我们采取兼容性的写法：varevent=event

9、

10、window.e