h5判断p标签里面的文字是否超过两行

可以通过以下步骤来判断p标签里面的文字是否超过两行：

1. 获取p标签的高度和行高。

var p = document.getElementsByTagName('p')[0];
var lineHeight = parseInt(getComputedStyle(p)['line-height']);
var height = parseInt(getComputedStyle(p)['height']);

2. 计算p标签的行数。

var lines = Math.ceil(height / lineHeight);

3. 判断行数是否超过两行。

if (lines > 2) {
  console.log('超过两行');
} else {
  console.log('不超过两行');
}

注意：上述方法仅适用于p标签中只含有文本，不包含内嵌的标签。如果p标签中包含内嵌的标签，需要对代码进行适当的修改。

相关问题

h5标签 里面写文字默认上下留白

是的，大多数浏览器默认情况下在 h5 标签中写文字时会有一定的上下留白。这是因为 h5 标签是一个块级元素，它会在页面中占据一定的空间，而浏览器为了使页面内容更加美观，会在 h5 标签的上下添加一定的间距。如果不想要这种默认的上下留白，可以使用 CSS 样式来覆盖默认样式。例如：

h5 {
  margin: 0;
  padding: 0;
}

这样就可以将 h5 标签的上下留白去掉。

h5判断div中的内容超出两行

可以通过以下方式来判断一个 div 中的内容是否超出了两行：

1. 获取该 div 的高度和行高，计算出它可以显示的最大行数。
2. 获取该 div 中的文本内容。
3. 将文本内容插入到一个隐藏的 span 元素中，并设置其宽度为该 div 的宽度。
4. 获取该 span 元素的高度和行高，计算出它实际占据的行数。
5. 判断实际占据的行数是否大于最大行数，如果是，则说明内容超过了两行。

以下是一个示例代码：

<div id="myDiv">这里是一些内容...</div>

var div = document.getElementById('myDiv');
var lineHeight = parseInt(getComputedStyle(div).lineHeight);
var maxHeight = lineHeight * 2; // 最大高度为两行
var span = document.createElement('span');
span.style.width = div.offsetWidth + 'px';
span.style.visibility = 'hidden';
span.innerHTML = div.innerHTML;
document.body.appendChild(span);
var actualHeight = span.offsetHeight;
document.body.removeChild(span);
if (actualHeight > maxHeight) {
  console.log('内容超过两行');
} else {
  console.log('内容不超过两行');
}

以上代码中，我们首先获取了 div 的行高和最大高度，然后创建了一个 span 元素，并将 div 中的内容插入到其中。接着，我们设置了 span 元素的宽度和可见性，并将其插入到 body 中，然后获取了其实际高度。最后，我们将 span 元素从 body 中删除，并判断实际高度是否超过了最大高度。