文档对象模型（DOM）元素内的文本行数，无论它是、
还是
在第二种方法中，我们将使用数组的split()方法，其中我们将把换行符作为参数传递。因此，数组将由换行符前后的元素创建，并且我们将计算数组的长度。
第 1 步 - 创建一个 HTML 模板，在其中添加一个具有行高的 div 元素。行高是特定行的高度。还创建一个将在其中生成输出的 span 标记。
步骤2 − 现在在脚本标签中访问行的父元素。使用offsetHeight计算父元素的总高度。
var domHeight = a.offsetHeight;
步骤 3 − 使用样式属性获取行的行高值。由于行高值还包含单位“px”，因此我们需要使用parseInt()函数从中获取数字。
第四步 − 现在将提取的值，即domHeight和line-height进行分割。
var totalLines = domHeight / linesHeight;
第5步- 变量“totalLines”包含父元素中的行数。这将返回span标签中的行数。
在这个例子中，我们将通过计算整个文档对象模型（DOM）元素的高度来统计行数，使用offsetHeight属性来获取DOM元素的高度，并将DOM高度除以行高，这将给我们输出DOM中存在的总行数。
<html>
<head>
<title>Count the text lines inside of DOM element</title>
</head>
<body>
<div id="lines" style="line-height: 30px;">
Welcome to tutorialspoint<br>
Visit us at: https://www.tutorialspoint.com/<br>
Buy the course of your domain <br>
Get the certificate <br>
Thank you for visiting<br>
</div>
<strong style="border: 2px solid black; padding: 0.1rem;">
Total number of lines:
<span id="out"></span>
</strong>
<script>
var a = document.getElementById("lines");
var domHeight = a.offsetHeight;
var linesHeight = parseInt(a.style.lineHeight);
var totalLines = domHeight / linesHeight;
document.getElementById("out").innerText=totalLines;
</script>
</body>
</html>
在下面的图像中，它显示了上面示例的输出。其中包含了“30px”的行高，它将DOM元素的“offsetHeight”分割，并返回span标签中元素的数量。
步骤 1 − 创建一个HTML模板，在其中添加一个div元素。创建一个span标签，用于生成输出。
第 2 步 − 现在使用 document.getElementById() 访问父元素内的文本。
const textLines = document.getElementById("lines").innerText;
步骤 3 − 使用数组split()方法，将换行符（“
”）作为参数传递给它。split方法将文本的行存储在数组中作为一个元素。
第 4 步 − 现在我们将使用数组的 length 方法来计算数组的长度，该长度将返回元素中的文本行数。
const numLines = textLines.split("").length;
第 5 步− 使用显示span标签中文本行数的输出
document.getElementById("out").innerText=numLines-1;
在这里，我们从“numLines”中减去了一个，因为它包含了一个额外的换行元素，该元素在所有文本行开始之前被插入。
在这个例子中，我们将使用数组 split() 方法来计算行数，在该方法中我们将访问变量中的 DOM，并借助 split(“
”) 方法中，我们将传递一个换行符作为参数，它将把所有元素存储在数组中作为换行符。之后我们将计算数组的长度，这将返回 DOM 中可用的文本行数。
<html>
<head>
<title>Count the text lines inside of DOM element</title>
</head>
<body>
<div id="lines" style="line-height: 30px;">
Welcome to tutorialspoint<br>
Visit us at: https://www.tutorialspoint.com/<br>
Thank you for visiting<br>
</div>
<strong style="border: 2px solid black; padding: 0.1rem;">
Total number of lines:
<span id="out"></span>
</strong>
<script>
const textLines = document.getElementById("lines").innerText;
const numLines = textLines.split("").length;
document.getElementById("out").innerText=numLines-1;
</script>
</body>
</html>
下图中显示了上述示例的输出。其中所有三个文本行都作为一个元素存储在数组中。因此，在计算数组的长度时，它将返回 3。
在第一个示例中，我们必须使用 parseInt() 解析行高的值，因为它也包含字符串值，如果我们将该值除以“offsetHeight”值，那么它将返回 (NaN ），意思是“不是数字”。所以我们使用了parseInt()，但是如果我们想以十进制返回它，我们也可以使用parseFloat()。
