Tag Archives: dom

正确设置绝对定位的dom元素的位置

先前在做ASTreeView右键菜单时遇到一个问题，是这样的： 因为页面的布局中，放置ASTreeView控件的容器叫container，当用户右键点击树节点时，edit, delete节点的菜单出现。由于container的position是relative的，右键菜单的div的position是absolute的，所以，设置菜单div的left, top属性时，会根据container的位置去定位，如图所示：   当用户点击右键，我们可以获取当前鼠标的坐标，这时，如果直接将鼠标的x，y坐标赋值给菜单的left和top就会出问题。因为鼠标坐标的原点是窗口的左上角，而菜单的原点是container的左上角。 那如何让菜单显示在鼠标点击的位置呢？接下来的代码将一步一步地实现： 首先是获取鼠标坐标的代码： function getMousePos(e) { e = e || event; var posx = 0; var posy = 0; if ( e.pageX && e.pageY ) { posx = e.pageX; posy = e.pageY; } else if (e.clientX && e.clientY ) { posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; posy = e.clientY… Read More »

在firefox下忽略whitespace节点遍历dom

IE和FF的whitespace节点处理是不一样的，IE会忽略dom中的whitespace，而ff不会，所以以下代码在IE和FF下执行效果是不一样的： <div id=”container”> <div id=”main”> <div id=”sub1″> hello sub 1. </div> <div id=”sub2″> hello sub 2. </div> </div> </div> <script type=”text/javascript”> function test(){ alert( $(‘container’).firstChild.firstChild.nextSibling.id ); } test(); </script> 为了使两个浏览器运行效果一致，则需要把所有dom中的whitespace节点去掉，可以这样写： /* * *remove whitespace for the dom, so that document.documentElement.firstChild.nextSibling.firstChild can work. * */ _rdc.cleanWhitespace = function( element ) { // If no element is… Read More »