如何获得以下语句的高度 - angular.element（'<div> content </div>'）？

Question

如何获得以下语句的高度 - angular.element（'content'）？

我不想把它放在DOM上，只是获得高度。我可以这样做吗？ 如果我必须首先将它放在DOM上，我将如何获得它？

Answer 1

  

我不想把它放在DOM上，只是获得高度。

你知道，这是一件事，我们不能独立于DOM讨论内容的高度，因为赋予文本维度的是事实，它是DOM的一部分，应用了一些样式，受到影响其他元素可能等等。

因此，如果您需要获取文本的高度，则需要执行以下操作：

1. 创建空元素，例如div并在其中附加文字内容：

   var div = angular.element('<div>content</div>');
   

2. 将此元素追加到DOM中，可能会设置使其“隐身”的样式

   div[0].style.cssText = 'position: absolute; top: -1000px;';
   document.body.appendChild(div[0]);
   

3. 计算身高

   var height = div[0].offsetHeight;  
   

4. 如果您不再需要它，请删除元素。

   document.body.removeChild(div[0]);
   

Answer 2

angular.element只是jQuery函数的别名。所以要回答你的问题，不，你不能在不将它放在DOM中的情况下获得元素的高度。如果您将元素添加到DOM但不显示它，您甚至无法获得元素的高度。

如果你想获得一个元素的高度，你可以简单地将它添加到DOM，获取高度并再次删除它。这个过程发生得太快，用户不会注意到它。