Javascript 如何返回p元素的行数？

考虑下面的p元素

<p>A B C D E F G H I J K L M N O P Q R S T U V W X Y Z qwertyuiopasdfghjklzxcvbnm 122333444455555666666777777788888888999999999</p>

A B C D E F G H I J K L M N O p Q R S T V W X Y Z qwertyuiopasdfghjklzxcvnm 12233344555666677777778888999999

在我当前的屏幕大小中，在我特定的浏览器中，在我正在键入此问题的checkbox元素中键入这段html代码需要整整3行

现在，如果这是真实html页面中的p元素，那么行数将取决于多种因素，如字体大小、字体系列、字母间距、字体重量、字符数、视口宽度、浏览器等

是否有任何javascript方法或css规则可以返回特定浏览器中特定p元素在特定屏幕大小下的行数

我的意思是，如果我们想用p元素的行数做一些事情，比如把它存储在变量中，或者在if语句中使用它，那么当p元素被加载时，我们如何检查行数呢

---

有什么方法可以做到这一点吗？

通过计算换行符，可以使用javascript，检查下面的代码

function lineBreakCount(str){
/* counts \n */
try {
    return((str.match(/[^\n]*\n[^\n]*/gi).length));
} catch(e) {
    return 0;
}
}

---

通过计算换行符，可以使用javascript检查下面的代码

function lineBreakCount(str){
/* counts \n */
try {
    return((str.match(/[^\n]*\n[^\n]*/gi).length));
} catch(e) {
    return 0;
}
}

---

元素高度除以线高度的简单计算可以给出在实际显示中渲染的线数

// 1. get height of element.
// 2. get line height.
// 3. divide 1 by 2 to figure out computed lines.

function countLines(element) {

    let x = $(element).prop('scrollHeight');
    let y = $(element).css('lineHeight');
    y = parseInt(y);

    return x/y;
}

---

元素高度除以线高度的简单计算可以给出在实际显示中渲染的线数

// 1. get height of element.
// 2. get line height.
// 3. divide 1 by 2 to figure out computed lines.

function countLines(element) {

    let x = $(element).prop('scrollHeight');
    let y = $(element).css('lineHeight');
    y = parseInt(y);

    return x/y;
}

---

可能重复-用一行计算p的高度，然后计算实际内容的高度。Devide和您有近似的行。元素的可能副本将有一个设置数量的填充/边距顶部和底部，与行数无关。-因此，简单地按一行段落的高度划分是行不通的。我不知道你为什么需要行数-这将更容易获得高度，扣除标准填充/边距量-剩下的是文本高度。您可以很容易地将其等同于许多行，或者将其保存为比较各种元素的内容高度的方法。可能的重复-使用一行计算p的高度，然后计算实际内容的高度。Devide和您有近似的行。元素的可能副本将有一个设置数量的填充/边距顶部和底部，与行数无关。-因此，简单地按一行段落的高度划分是行不通的。我不知道你为什么需要行数-这将更容易获得高度，扣除标准填充/边距量-剩下的是文本高度。您可以很容易地将其等同于许多行，或者将其保存为比较各种元素的内容高度的方法。