Question

我正在使用Range对象和Element.getBoundingClientRect（）来计算某些文本的位置。我在Chrome和Firefox中获得了预期的结果，但在IE中，顶级属性值是错误的。

更具体地说，包含在具有行高度值的span元素中的文本。这个粗略的小提琴说明了问题https://jsfiddle.net/eekr4qhs/

示例HTML

<div style="display:inline-block; width:100px;height:500px; background-  color:red">
    <span id="span1" style="line-height:500px">
        text
    </span>
</div>

代码段

var spanEl = document.getElementById("span1");
var textNode = spanEl.childNodes[0]; 
var offsetStart = 0;
var offsetEnd = textNode.nodeValue.length || 0;

var range = document.createRange();
range.setStart(textNode, offsetStart);
range.setEnd(textNode, offsetEnd);

var rect = range.getBoundingClientRect();
console.log(rect.top);

在计算范围的DOMRect

时，IE似乎没有考虑行高属性值

如果我在Chrome中打开小提琴，我会得到249.09722900390625作为rect的顶部，而在IE 11中，top是8

之前有没有人见过这个问题，并且在某种程度上让IE返回该范围的正确边界客户端矩形？

Internet Explorer 11中的范围getBoundingClientRect（）顶部不正确

0 个答案: