एक स्ट्रिंग सीधे जावास्क्रिप्ट को काटें

Question

मैं सीधे जावास्क्रिप्ट का उपयोग करके गतिशील रूप से भरी हुई स्ट्रिंग को छोटा करना चाहता हूं। यह एक यूआरएल है, इसलिए कोई स्थान नहीं है, और मैं स्पष्ट रूप से शब्द सीमाओं, बस वर्णों के बारे में परवाह नहीं करता हूं।

यहाँ मुझे क्या मिला है:

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

Comments

आप किस भाग को काट देना चाहते हैं? आपका उदाहरण इरादे को अच्छी तरह से व्यक्त नहीं करता है।

— लार्सनल

ओह ठीक है- मैं URL को एक निश्चित मात्रा में वर्णों में विभाजित करना चाहता हूं, ताकि जब मैं "foo" का आंतरिक एचटीएमएल सेट करूं तो यह बहुत लंबा होने पर div से बाहर नहीं निकलेगा।

— बॉब

* लेकिन- सिर्फ भीतर HTML, नहीं var pathname ही।

— बॉब

सिर्फ div के अतिप्रवाह को छिपाने के लिए css का उपयोग क्यों नहीं किया जाता है? अतिप्रवाह: छिपा हुआ

— शमूएल

@ शमूएल क्योंकि यह खराब व्यवहार वाला होगा यूआई-वार- यदि उपयोगकर्ता यूआरएल को देखने की उम्मीद कर रहा है तो वे सिर्फ (डॉक्यूमेंट। क्रेफर) से आए हैं, और मैं इसे छोटा कर रहा हूं, मैं उन्हें संकेत देना चाहता हूं कि वे केवल एक भाग देख रहे हैं url का, और यह कि कोई त्रुटि नहीं थी। इसके अलावा, जिस विधि का आप प्रस्ताव करते हैं वह पात्रों को आधे में काट देगा जो भयानक लगेगा।

— बॉब

Answer 1

प्रतिस्थापन विधि का उपयोग करें :

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

तो आपके मामले में:

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>"

Comments

यदि आप 0 से शुरू होने वाला एक विकल्प चाहते हैं, तो मूल कार्य 3 कम वर्णों के साथ सटीक कार्य करेगा;)

— जैकोप्रन

अगर स्ट्रिंग की तुलना में छोटा है तो length

— पदार्थ

यदि आपकी "स्ट्रिंग" एक संख्या है, तो आपको .toString().इसे एक स्ट्रिंग में बदलने के लिए सम्मिलित करने की भी आवश्यकता है जो substring()संभाल सकती है।

— Not2qubit

MDN डॉक्स W3schools से बेहतर हैं

— BigRon

Answer 2

हाँ, प्रतिस्थापन। आपको एक Math.min करने की आवश्यकता नहीं है; स्ट्रिंग की लंबाई से अधिक लंबे सूचकांक के साथ मूल लंबाई पर समाप्त होता है।

परंतु!

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

यह एक गलती है। क्या होगा अगर document.referrer में एक एपोस्ट्रोफी थी? या विभिन्न अन्य वर्ण जिनका HTML में विशेष अर्थ है। सबसे खराब स्थिति में, रेफ़र में हमलावर कोड आपके पेज में जावास्क्रिप्ट को इंजेक्ट कर सकता है, जो एक XSS सुरक्षा छेद है।

जबकि ऐसा होने से रोकने के लिए मैन्युअल रूप से पथनाम में वर्णों से बचना संभव है, यह थोड़ा दर्द है। आप भीतर के HTML स्ट्रिंग्स के साथ फ़िडलिंग की तुलना में DOM विधियों का उपयोग करके बेहतर हैं।

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);
}

Comments

मैं उलझन में हूँ, आपका समाधान सुरक्षा छेद से कैसे बचता है?

— बॉब

जब आप 'createTextNode' और '.href = ...' जैसी DOM विधियों का उपयोग करते हैं, तो आप सीधे वास्तविक अंतर्निहित सादे टेक्स्ट वैल्यू सेट कर रहे हैं। जब आप HTML लिख रहे होते हैं, तो या तो HTML फ़ाइल में या आंतरिक HTML के माध्यम से, आपको HTML से बचने के नियमों का पालन करना चाहिए। इसलिए whilst 'createTextNode (' A <B & C ') ठीक है, भीतर के HTML के साथ आपको' innerHTML = 'A & lt; B & amp; C' 'कहना होगा।

— bobince

Answer 3

सोचा था कि मैं शुगर दूंगा । इसमें एक ट्रंकट विधि है जो बहुत स्मार्ट है।

से प्रलेखन :

एक तार काटता है। जब तक विभाजन सत्य नहीं होता, तब तक ट्रंकेट शब्दों को विभाजित नहीं करेगा, और इसके बजाय उस शब्द को छोड़ दें जहां ट्रंकेशन हुआ है।

उदाहरण:

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

आउटपुट:

just sitting on...

Comments

Sugar is a Javascript library that extends native objects… जावास्क्रिप्ट में देशी वस्तुओं का विस्तार आमतौर पर एक बुरा विचार ™ माना जाता है।

— जेजेन थॉमस

@JezenThomas कभी-कभी बुरा विचार सबसे उपयुक्त विचार है।

— विदितकोठारी

Answer 4

निम्नलिखित कोड एक स्ट्रिंग को काटता है और शब्दों को विभाजित नहीं करेगा, और इसके बजाय उस शब्द को छोड़ दें जहां ट्रंकेशन हुआ है। पूरी तरह से 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('');
    }

Comments

यह अच्छा होगा एक "..." अगर परिणाम! == str;

— सिंह केसिरो

Answer 5

यहाँ एक विधि है जिसका आप उपयोग कर सकते हैं। यह FreeCodeCamp चुनौतियों में से एक के लिए जवाब है:

function truncateString(str, num) {


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

Answer 6

अपडेट किया गया ES6 संस्करण

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...'

Comments

यह हमेशा प्रतिस्थापन को आमंत्रित करता है, तब भी जब यह आवश्यक नहीं हो सकता है ...

— क्लिंट ईस्टवुड

@ क्लिंटएस्टवुड अच्छा फीडबैक, मैंने जवाब अपडेट कर दिया है। स्ट्रिंग की लंबाई बनाम अधिकतम लंबाई की जाँच करने का मतलब यह भी था कि मैं शो-टॉट्स कांस्ट को हटा सकता हूं और टर्नरी इसे टिडियर बना सकता है। चीयर्स।

— सैम लोगन

Answer 7

हाँ, substringबढ़िया काम करता है:

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;
};

Answer 8

मामले में आप शब्द से अलग करना चाहते हैं।

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);

Answer 9

var pa = document.getElementsByTagName('p')[0].innerHTML;
var rpa = document.getElementsByTagName('p')[0];
// console.log(pa.slice(0, 30));
var newPa = pa.slice(0, 29).concat('...');
rpa.textContent = newPa;
console.log(newPa)

<p>
some text here some text here some text here some text here some text here some text here some text here some text here some text here some text here some text here some text here some text here some text here some text here
</p>