dom elements_javascript 팁의 성가신 위치 캡슐화 코드를 얻으세요.

소개
다양한 브라우저에서 dom 요소를 얻는 위치 해결
호환성
ie 6 7 8 firefox 3.6 chrome 4.0 현재 이러한 브라우저만 테스트되었습니다.
저자
Jelle · lu QQ :271412542 이메일:idche@qq.com 블로그:http://www.cnblogs.com/idche/
소스 코드 설명
jquery 소스 코드는 나에게 많은 도움이 되었고, Bruce Lee라는 사람도 사용했습니다. 물론 동급생의 소스 코드는 인터넷에서 더 많은 리소스를 얻습니다.
함수 설명
// jelle(elem) 객체 elem은 객체 ID를 전달하거나, 윈도우인 경우 dom 객체를 전달하고, 윈도우 객체를 전달합니다.
//.offset()은 객체의 절대 위치를 반환합니다. 브라우저를 기준으로 한 현재 객체, 반환 값 = {top:a,left:b}
//.inner()는 현재 객체의 가시 영역의 너비와 높이를 반환합니다. 반환 값 = {wisth :a,left:b};
//.scroll() 현재 개체의 위쪽 및 왼쪽 볼륨 영역을 반환합니다. ,반환값 = {top:a,left:b};
//.offparent()는 상위 노드에서 현재 객체의 왼쪽 상단 위치를 반환합니다. , 반환 값 = {top:a,left:b};//.client()는 현재 객체의 사용 가능한 높이와 너비를 반환합니다. 반환 값 = {width:a,height:b}; // .screen()은 현재 화면의 사용 가능한 높이와 너비를 반환합니다. 반환 값 = {width:a,height:b}
//.mouse(event)는 현재 마우스의 x, y 좌표를 반환합니다. , elem은 빈 값으로 반환되지 않습니다. elem의 좌표를 기준으로 반환 값 = {x:a,y:b};

예
//예: 다음을 사용하여 div의 가시 영역 너비를 반환합니다. ID 테스트 //jelle('test' ).inner().width //width
jquery 기반 소스코드

코드 복사 코드는 다음과 같습니다.

介绍

解决各个浏览器下 获取dom 元素的 位置

兼容性

ie 6 7 8 firefox 3.6 chrome 4.0 目前只测试了这几个浏览器

作者

Jelle · lu QQ:271412542 Email:idche@qq.com blogs:http://www.cnblogs.com/idche/

源码说明

jquery 源码给我很大帮助，也用到一个叫 布鲁斯 · 李 的同学的源码，当然更多资源来源于网络。

功能说明

• // jelle(elem) 对象 elem传递对象ID 或者 dom对象 如果是窗口 传递 window 对象


• //.offset() 返回当前对象相对浏览器的绝对位置 ,返回值 = {top:a,left:b};


• //.inner() 返回当前对象可见区域 宽度与高度 ,返回值 = {wisth:a,left:b};


• //.scroll() 返回当前对象被卷区top 和 left。 ,返回值 = {top:a,left:b};


• //.offparent() 返回当前对象距离父节点的位置 top left。 ,返回值 = {top:a,left:b};


• //.client() 返回当前对象的可用高度和宽度 ,返回值 = {width:a,height:b};


• //.screen() 返回当前屏幕的可用高度和宽度 ,返回值 = {width:a,height:b};


• //.mouse(event) 返回当前鼠标的x,y坐标,elem不为空返回相对elem的坐标 ,返回值 = {x:a,y:b};
  

例子

//例子: 返回一个ID 为 test 的div 的可见区域宽度
//jelle('test').inner().width
//这里可以紧接后面直接下 width

jelle('t').offset().top

div.id=o

div.id=t

div.id=h
OK 这里是一个测试的地方。他包含3个DIV嵌套