如何使用javascript检测文本大小和位置？

---

这是一个网站上的简单文本，我想知道我的第一个标题的长度和高度是多少像素，在哪个位置。。。如何通过javascript检测它？谢谢。

element.offsetWidth

/

element.offsetHeight

查看元素尺寸。

---

element.offsetTop

/

element.offsetLeft

用于左上角位置（相对于其）。

您可以使用

clientHeight

和

clientWidth

计算值。像

document.getElementById("DOMID").clientWidth

要更改标题的内容，请执行以下操作：

while(header.firstChild) {
    header.removeChild(header.firstChild);
}
header.appendChild(document.createTextNode("some new content"));

---

可以使用display:inline样式创建临时h1元素。。。然后得到偏移网络宽度。 试试这个：

<script type="text/javascript">
    var domId = 'dom-id' + Math.random();
    var temp = document.createElement('div');
    var body = document.getElementsByTagName('body')[0];
    body.appendChild(temp);
    var text = document.getElementsByTagName('h1')[0].innerHTML;
    var width = null;
    var tempH1 = null;

    temp.innerHTML = '<h1 style="display: inline" id="' + domId + '">' + text + '</h1>';

    tempH1 = document.getElementById(domId);
    width = tempH1.offsetWidth;
    body.removeChild(temp);

    alert(width);
</script>

var domId='dom id'+Math.random（）；
var temp=document.createElement（'div'）；
var body=document.getElementsByTagName（'body'）[0]；
身体.附件（临时）；
var text=document.getElementsByTagName（'h1'）[0].innerHTML；
var-width=null；
var tempH1=null；
temp.innerHTML=''+文本+''；
tempH1=document.getElementById（domId）；
宽度=tempH1.offsetWidth；
体外培养（温度）；
警报（宽度）；

好吧，我可以使用它，但我更喜欢一个纯javascript解决方案。使用jQuery很容易。offset（）返回文档引用的绝对位置，而px中的.css（“宽度”）和.css（“高度”）维度。您可以将.position（）与jQuery一起使用，以返回文档左上方的对象elemnt@SantiagoRebella返回引用到唯一容器的坐标，不至于document@JeanValjean但如果不在任何容器中，则不返回文档的左上角？我非常确定是：（如果我只想要

我的第一个

，这可以做到吗？您可以将文本设置为

“我的第一个”

，然后获取我发布的值，并将文本设置回原来的位置。除此之外，这是不可能的。

<script type="text/javascript">
    var domId = 'dom-id' + Math.random();
    var temp = document.createElement('div');
    var body = document.getElementsByTagName('body')[0];
    body.appendChild(temp);
    var text = document.getElementsByTagName('h1')[0].innerHTML;
    var width = null;
    var tempH1 = null;

    temp.innerHTML = '<h1 style="display: inline" id="' + domId + '">' + text + '</h1>';

    tempH1 = document.getElementById(domId);
    width = tempH1.offsetWidth;
    body.removeChild(temp);

    alert(width);
</script>