javascript regex to replace url of certain length with

Question

I want a regex which will replace the long url with ..., for example,

I pass in a string with url in it, i.e

<a href="http://www.abc.com/thisSite/myPages/blah-blah-blah.aspx">http://www.abc.com/thisSite/myPages/blah-blah-blah.aspx</a>

should be converted to

<a href="http://www.abc.com/thisSite/myPages/blah-blah-blah.aspx">http://www.abc.com/th....</a>

any help would be appriciated.

You can post HTML as text by indenting it 4 spaces, thus making it "code" or "preformatted". There's also a button in the mini-editor that will indent a selected block of lines 4 spaces (the one with label 1010101) — Jim Garrison, Aug 24 '10 at 03:12
are you using any library (i.g. JQuery, etc.) ? Are you generating the HTML from a server script (i.g. PHP) ? It would be best if this was solved from the serving script itself, unless you're getting the URLs from an Ajax call, thus the library... — Yanick Rochon, Aug 24 '10 at 03:23
No I am getting the content from a service call, and generating HTML in javaScript .. so it can't be done in the server ... :( — alittlebitofday, Aug 24 '10 at 03:26
are you retrieving the content from the service call as HTML directly, or is it an XML that you are parsing, or a JSON from which you create your anchor tags with? — Yanick Rochon, Aug 24 '10 at 03:35

robotdana · Accepted Answer · 2010-08-24T04:31:15.707

Jquery

$('a').each(function(){
   var text = $(this).text();
   if (text.length > 20 && text.substr(0,7) == "http://"){ // it looks like a URL and it's long
      text = text.substr(0,20) + '&hellip;';
      $(this).text(text);
   }

});

normal javascript

var links = document.getElementsByTagName('a');
for (var i = 0;i=links.length-1;i++) {
   var text = links[i].innerHTML;
   if (text.length > 20 && text.substr(0,7) == "http://"){ // it looks like a URL and it's long
      text = text.substr(0,20) + '&hellip;';
      links[i].innerHTML = text;
   }
}

I have no idea if this works or not as I wrote it from my head. have fun.

fyi: `as` is a reserved word. You'll need to change that. – Ben Rowe Aug 24 '10 at 03:54 — Ben Rowe, Aug 24 '10 at 03:54

score 1 · Answer 2 · edited May 23 '17 at 12:26

Based on this solution, here is what you could do :

String.prototype.trunc =
     function(n,useWordBoundary,wordChar){
         if (!wordChar) wordChar = ' ';
         var toLong = this.length>n,
             s_ = toLong ? this.substr(0,n-1) : this;
         s_ = useWordBoundary && toLong ? s_.substr(0,s_.lastIndexOf(wordChar)) : s_;
         return toLong ? s_ + '&hellip;' : s_;
     };

Then simply apply this to anchors displaying links :

var maxLength = 40;
var aElements = document.getElementsByTagName('a'), _text, _param;
var aLen = aElements.length;

for (var i=0; i<aLen; i++) {
   _text = aElements[i].innerHTML;
   // remove url params
   if (0 <= (_param = _text.indexOf('?'))) {
      _text = _text.substr(0, _param - 1);
   }
   if (0 == _text.indexOf('http://') && _text.length > maxLength) {
      _text = _text.trunc(maxLength);
      // _text = _text.trunc(maxLength, true, '/'); 
   }
   aElements[i].innerHTML = _text;
}

I'd say don't bother with URL parameters, etc.; just truncate the text node with `trunc`. — strager, Aug 24 '10 at 04:12
it's just prettier to the end user not to see URL params... but then again, they may be needed / required. In any case, the IF block can simply be commented (or conditional to another parameter...) — Yanick Rochon, Aug 24 '10 at 04:17

score 0 · Answer 3 · answered Aug 24 '10 at 03:35

You'll need to use the following bit of code

<script>
var cutOffAt = 20;
var anchorRef = getAnchorFromDom();
var text = anchorRef.innerHtml;
if(text.length > 20) {
  anchorRef.innerHtml = text.substr(0, cutOffAt);
}

function getAnchorFromDom()
{
  // provide your own logic here
  return document.getElementsByTagName('a')[0];
}
</script>

Untested.

Scott Evernden · Answer 4 · 2010-08-27T04:36:42.967

And Here i was thinking you actually wanted to use a regexp and never mentioned jquery .. headslap ...

var s = '<a href="http://www.abc.com/thisSite/myPages/blah-blah-blah.aspx">http://www.abc.com/thisSite/myPages/blah-blah-blah.aspx</a>';
var t = s.replace(/(<a [^>]*>)([^<]{1,20})([^<]*)(<\/a>)/, function(str, p1, p2, p3, p4) { return p1 + p2 + (p3.length ? '...' : '') + p4; });
document.write(t);

http://jsfiddle.net/5kSzL/

javascript regex to replace url of certain length with

4 Answers4