Question

我只是想知道，有什么方法我们只能从h2标题显示第一个字。

例如：

在源代码中，它应该如下所示

<h2> Stackoverflow is an Ideal Place</h2>

但是，在实时网站上看起来应该是这样的

Stackoverflow

基本上，我们希望从整个标题显示FIRST WORD。但是，搜索引擎应该阅读完整的标题。

Answer 1

试试这种方式

$(document).ready(function(){
    var ac = $("#ac").text().split(' '); 
    $("#ac").text(ac[0])
})

Answer 2

你不能只用CSS做到这一点。你有第一个字母，第一行，但不是第一个单词的伪元素选择器。

您可以设置宽度，以便只显示第一个单词（当然使用overflow:hidden），但这对于所有字体系列和大小都不是万无一失。

最后，您可以使用纯JavaScript或jQuery来完成。

普通JS：

var el = document.getElementById("ac");
el.innerHTML = el.innerHTML.split(/\s/)[0];

jQuery的：

$("#ac").html(function(i, h) { return h.split(/\s/)[0];});

Answer 3

这将做你想要的......

<h2 id="ac">Stackoverflow is an Ideal Place</h2>

$('#ac').html( function(i, h) {
    var words = h.split(/\s/);
    return ' <h2>' + words[0] + '</h2>';
});

如何使用JavaScript或CSS仅显示H2标题的第一个单词

3 个答案: