dom 要素の厄介な位置カプセル化コードを取得する_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};

Example
//例: div の表示領域の幅を返します。 ID test //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嵌套