0

我想遍历一组 html 元素，在本例中为 H1s，计算字符数，如果字符数大于 140，我想截断字符并仅输出前 140 个字符，然后是省略号。我一直在通过控制台测试我的代码，到目前为止已经想出了这个。

$( "h1.evTitle" ).each(function( truncate ) {
     console.log($(this).text().substring(0, 140).split(" ").slice(0, -1).join(" ") + "...");
});

这可以正常工作，但它会将省略号添加到每个字符串上，而不管长度如何。关于 if 语句仅将其应用于长度大于 140 个字符的字符串的任何想法？请记住，这将是一系列 H1，而不仅仅是其中一个。

这是我的最终代码，以防有人也想这样做。

$('h1').each(function () {
    if ($(this).text().length>140) {
        $(this).text($(this).text().substring(0, 140).split(" ").slice(0, -1).join(" ") + "...");
    }
});

我添加了.split(" ")将字符串分隔成一个包含每个单词的数组，然后我用来.slice(0, -1)删除数组中的最后一项（这样我就可以从部分单词中删除任何垃圾字符，然后用来.join(" ")将该数组重新变成一个字符串.

4

3 回答 3

2

先检查一下：

var str = $(this).text();
if (str.length > 140) {
    str = str.substring(0, 140) + "...";
}

由于您使用的是 jQuery，因此您可能会$.trim在其中抛出一两个：

var str = $.trim($(this).text());
if (str.length > 140) {
    str = $.trim(str.substring(0, 140)) + "...";
}

第一个删除原始上的前导和尾随空格，第二个防止省略号前面有空格。

另请注意，有一种更简单的截断和添加省略号的方法（如上所示）。

如果您使用拆分/加入的目标是删除多余的空格，我认为不会，但这会：

var str = $.trim($(this).text());
str = str.replace(/  +/g, " ");
if (str.length > 140) {
    str = $.trim(str.substring(0, 140)) + "...";
}

实例| 源 （在示例中，我将结果写回元素）

于 2013-03-14T15:48:42.650 回答
1

只需$(this).text().length > 140在添加省略号之前检查是否。

于 2013-03-14T15:48:36.507 回答
1 
$('h1').each(function () {
    if ($(this).text().length>140) {
        $(this).text($(this).text().substr(0, 140) + "...");
    }
});

jsFiddle 示例

于 2013-03-14T15:50:45.477 回答