Asked  6 Months ago    Answers:  5   Viewed   33 times

Does anyone have suggestions for detecting URLs in a set of strings?

arrayOfStrings.forEach(function(string){
  // detect URLs in strings and do something swell,
  // like creating elements with links.
});

Update: I wound up using this regex for link detection… Apparently several years later.

kLINK_DETECTION_REGEX = /(([a-z]+://)?(([a-z0-9-]+.)+([a-z]{2}|aero|arpa|biz|com|coop|edu|gov|info|int|jobs|mil|museum|name|nato|net|org|pro|travel|local|internal))(:[0-9]{1,5})?(/[a-z0-9_-.~]+)*(/([a-z0-9_-.]*)(?[a-z0-9+_-.%=&]*)?)?(#[a-zA-Z0-9!$&'()*+.=-_~:@/?]*)?)(s+|$)/gi

The full helper (with optional Handlebars support) is at gist #1654670.

 Answers

21

First you need a good regex that matches urls. This is hard to do. See here, here and here:

...almost anything is a valid URL. There are some punctuation rules for splitting it up. Absent any punctuation, you still have a valid URL.

Check the RFC carefully and see if you can construct an "invalid" URL. The rules are very flexible.

For example ::::: is a valid URL. The path is ":::::". A pretty stupid filename, but a valid filename.

Also, ///// is a valid URL. The netloc ("hostname") is "". The path is "///". Again, stupid. Also valid. This URL normalizes to "///" which is the equivalent.

Something like "bad://///worse/////" is perfectly valid. Dumb but valid.

Anyway, this answer is not meant to give you the best regex but rather a proof of how to do the string wrapping inside the text, with JavaScript.

OK so lets just use this one: /(https?://[^s]+)/g

Again, this is a bad regex. It will have many false positives. However it's good enough for this example.

function urlify(text) {
  var urlRegex = /(https?://[^s]+)/g;
  return text.replace(urlRegex, function(url) {
    return '<a href="' + url + '">' + url + '</a>';
  })
  // or alternatively
  // return text.replace(urlRegex, '<a href="$1">$1</a>')
}

var text = 'Find me at http://www.example.com and also at http://stackoverflow.com';
var html = urlify(text);

console.log(html)
// html now looks like:
// "Find me at <a href="http://www.example.com">http://www.example.com</a> and also at <a href="http://stackoverflow.com">http://stackoverflow.com</a>"

So in sum try:

$$('#pad dl dd').each(function(element) {
    element.innerHTML = urlify(element.innerHTML);
});
Tuesday, June 1, 2021
 
erotsppa
answered 6 Months ago
23
var url = "http://example.com/index.htm";
var filename = url.match(/([^/]+)(?=.w+$)/)[0];

Let's go through the regular expression:

[^/]+    # one or more character that isn't a slash
(?=       # open a positive lookahead assertion
  .      # a literal dot character
  w+     # one or more word characters
  $       # end of string boundary
)         # end of the lookahead

This expression will collect all characters that aren't a slash that are immediately followed (thanks to the lookahead) by an extension and the end of the string -- or, in other words, everything after the last slash and until the extension.

Alternately, you can do this without regular expressions altogether, by finding the position of the last / and the last . using lastIndexOf and getting a substring between those points:

var url = "http://example.com/index.htm";
var filename = url.substring(url.lastIndexOf("/") + 1, url.lastIndexOf("."));
Wednesday, June 23, 2021
 
shin
answered 6 Months ago
95
function has_scrollbar(elem_id)
{
    const elem = document.getElementById(elem_id);
    if (elem.clientHeight < elem.scrollHeight)
        alert("The element has a vertical scrollbar!");
    else
        alert("The element doesn't have a vertical scrollbar.");
}

See this jsFiddle http://jsfiddle.net/qKNXH/

Wednesday, July 21, 2021
 
mozlima
answered 5 Months ago
28

Here is this regexp

.*/([^?]+)

and JS code:

let lastUrlPart = /.*/([^?]+)/.exec(url)[1];

let lastUrlPart = url => /.*/([^?]+)/.exec(url)[1];



// TEST

let t1 = "https://scontent-fra3-1.xx.fbcdn.net/v/t1.0-9/14238253_132683573850463_7287992614234853254_n.jpg?oh=fdbf6800f33876a86ed17835cfce8e3b&oe=599548AC"

let t2 = "https://scontent-fra3-1.xx.fbcdn.net/v/t1.0-9/14238253_132683573850463_7287992614234853254_n.jpg"

console.log(lastUrlPart(t1));
console.log(lastUrlPart(t2));

May be there are better alternatives?

Sunday, August 29, 2021
 
Lodrik
answered 3 Months ago
48

You can test navigator.userAgent for the strings Safari/ and Windows (list of Safari user agent strings), e.g.: Live Example

var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf("safari/") !== -1 &&  // It says it's Safari
    ua.indexOf("windows") !== -1 &&  // It says it's on Windows
    ua.indexOf("chrom")   === -1     // It DOESN'T say it's Chrome/Chromium
    ) {
    // Looks like Safari on Windows (but browser detection is unreliable and best avoided)
}

...but browser detection is usually not the best solution to a problem. Much better, where you can, to use feature detection. You can feature-detect nearly everything. Kangax has a great list of feature detects, and of course libs like Moderizr do them as well. But I don't know your use-case...

Saturday, October 16, 2021
 
Saxophlutist
answered 2 Months ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :
 
Share