Memotong JavaScript string lurus

Saya ingin memotong string yang dimuat secara dinamis menggunakan JavaScript lurus. Ini url, jadi tidak ada spasi, dan saya jelas tidak peduli tentang batas kata, hanya karakter.

Inilah yang saya dapatkan:

var pathname = document.referrer; //wont work if accessing file:// paths
document.getElementById("foo").innerHTML = "<a href='" + pathname +"'>" + pathname +"</a>"

Gunakan metode substring :

var length = 3;
var myString = "ABCDEFG";
var myTruncatedString = myString.substring(0,length);
// The value of myTruncatedString is "ABC"

Jadi dalam kasus Anda:

var length = 3;  // set to the number of characters you want to keep
var pathname = document.referrer;
var trimmedPathname = pathname.substring(0, Math.min(length,pathname.length));

document.getElementById("foo").innerHTML =
     "<a href='" + pathname +"'>" + trimmedPathname + "</a>"

ya, substring. Anda tidak perlu melakukan Math.min; substring dengan indeks yang lebih panjang dari panjang string berakhir pada panjang aslinya.

Tapi!

document.getElementById("foo").innerHTML = "<a href='" + pathname +"'>" + pathname +"</a>"

Ini sebuah kesalahan. Bagaimana jika document.referrer memiliki tanda kutip? Atau berbagai karakter lain yang memiliki makna khusus dalam HTML. Dalam kasus terburuk, kode penyerang di pengarah dapat menyuntikkan JavaScript ke halaman Anda, yang merupakan lubang keamanan XSS.

Sementara itu mungkin untuk melarikan diri karakter dalam pathname secara manual untuk menghentikan hal ini terjadi, itu agak menyebalkan. Anda lebih baik menggunakan metode DOM daripada mengutak-atik string innerHTML.

if (document.referrer) {
    var trimmed= document.referrer.substring(0, 64);
    var link= document.createElement('a');
    link.href= document.referrer;
    link.appendChild(document.createTextNode(trimmed));
    document.getElementById('foo').appendChild(link);
}

Kupikir aku akan memberi Sugar . Ini memiliki metode terpotong yang cukup pintar.

Dari dokumentasi :

Memotong string. Kecuali pemisahan benar, pemotongan tidak akan membagi kata, dan sebaliknya membuang kata di mana pemotongan terjadi.

Contoh:

'just sittin on the dock of the bay'.truncate(20)

Keluaran:

just sitting on...

Kode berikut memotong string dan tidak akan membagi kata, dan sebaliknya membuang kata di mana pemotongan terjadi. Benar-benar berdasarkan sumber Sugar.js.

function truncateOnWord(str, limit) {
        var trimmable = '\u0009\u000A\u000B\u000C\u000D\u0020\u00A0\u1680\u180E\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200A\u202F\u205F\u2028\u2029\u3000\uFEFF';
        var reg = new RegExp('(?=[' + trimmable + '])');
        var words = str.split(reg);
        var count = 0;
        return words.filter(function(word) {
            count += word.length;
            return count <= limit;
        }).join('');
    }

Inilah satu metode yang dapat Anda gunakan. Ini adalah jawaban untuk salah satu Tantangan FreeCodeCamp:

function truncateString(str, num) {


if (str.length > num) {
return str.slice(0, num) + "...";}
 else {
 return str;}}

Versi ES6 yang diperbarui

const truncateString = (string, maxLength = 50) => {
  if (!string) return null;
  if (string.length <= maxLength) return string;
  return `${string.substring(0, maxLength)}...`;
};

truncateString('what up', 4); // returns 'what...'

Ya, substringsangat bagus:

stringTruncate('Hello world', 5); //output "Hello..."
stringTruncate('Hello world', 20);//output "Hello world"

var stringTruncate = function(str, length){
  var dots = str.length > length ? '...' : '';
  return str.substring(0, length)+dots;
};

jika Anda ingin memotong dengan kata.

function limit(str, limit, end) {

      limit = (limit)? limit : 100;
      end = (end)? end : '...';
      str = str.split(' ');
      
      if (str.length > limit) {
        var cutTolimit = str.slice(0, limit);
        return cutTolimit.join(' ') + ' ' + end;
      }

      return str.join(' ');
    }

    var limit = limit('ILorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus metus magna, maximus a dictum et, hendrerit ac ligula. Vestibulum massa sapien, venenatis et massa vel, commodo elementum turpis. Nullam cursus, enim in semper luctus, odio turpis dictum lectus', 20);

    console.log(limit);