dom – getBoundingClientRect()在XUL中返回零
我的firefox扩展有问题
我有一个带标签云的hbox的XUL弹出式面板,以及一个向这个hbox添加div的JS代码: <hbox id="tag_base" ondblclick="alert('done')"/> JS: var root = document.getElementById('tag_base'); var tag = document.createElement('div'); tag.textContent = 'test'; root.appendChild(tag); var rect = tag.getBoundingClientRect() alert(rect.top) 我需要获取每个添加的div的维度,但是,getBoundingClientRect只是拒绝工作. 如果我在Chromebug中设置断点,则会正确报告所有内容. 这让我很困惑. 任何可能导致此问题的提示都将不胜感激. 解决方法
虽然我找不到关于这个看似根本问题的任何文档,但您注意到的问题很可能是因为布局(也就是“回流”)过程在您要求坐标时尚未运行.
布局/重排过程使页面的DOM具有页面所具有的任何样式,并确定元素和页面其他部分的位置和尺寸(您可以尝试读取Notes on HTML reflow,尽管它不是针对Web开发人员而且可能有点过时). 在对DOM进行任何更改后,此重排过程不会同步运行,否则代码就像 elt.style.top = "5px"; elt.style.left = "15px"; 会更新布局两次,这是低效的. 另一方面,要求元素位置/维度(至少通过.offsetTop)应该强制布局返回正确的信息.出于某种原因,这种情况不会发生在你的情况下,我不确定为什么. 请创建一个简单的测试用例来演示问题并在bugzilla.mozilla.org(CC me – asqueella@gmail.com)中提交错误. 我的猜测是这与XUL布局有关,它不如HTML强大;您可以尝试在iframe中的HTML文档中创建云,或者至少在< description>中创建云.使用createElementNS创建您使用当前代码创建的真实HTML元素instead of xul:div. (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |