第 87 题：在输入框中如何判断输入的是一个正确的网址

[yygmind]

[lhyt]

不上正则，一个简单的玩法

function isUrl(url) {
	const a = document.createElement('a')
	a.href = url
	return [
		/^(http|https):$/.test(a.protocol),
		a.host,
		a.pathname !== url,
		a.pathname !== `/${url}`,
	].find(x => !x) === undefined
}

[andyliangshan]

var reg=/^([hH][tT]{2}[pP]://|[hH][tT]{2}[pP][sS]://)(([A-Za-z0-9-]+).)+([A-Za-z0-9-/])+$/;
reg.test(document.querySelector('input').value);

[IdeaEcho]

不上正则，一个简单的玩法

function isUrl(url) {
	const a = document.createElement('a')
	a.href = url
	return [
		/^(http|https):$/.test(a.protocol),
		a.host,
		a.pathname !== url,
		a.pathname !== `/${url}`,
	].find(x => !x) === undefined
}

可以问一下吗？a.pathname !== /${url} 这个没理解

[lhyt]

不上正则，一个简单的玩法

function isUrl(url) {
	const a = document.createElement('a')
	a.href = url
	return [
		/^(http|https):$/.test(a.protocol),
		a.host,
		a.pathname !== url,
		a.pathname !== `/${url}`,
	].find(x => !x) === undefined
}

可以问一下吗？a.pathname !== /${url} 这个没理解

输入/a 和 输入 a，不算完整网站。但是pathname都是/a

[chenshengshui]

function isUrl(url) {
       try {
           new URL(url);
           return true;
       }catch(err){
     return false;
}}

[ovarte]

function isUrl(url) {
       try {
           new URL(url);
           return true;
       }catch(err){
     return false;
}}

[halionn]

const isUrl = urlStr => {
    try {
        const { href, origin, host, hostname, pathname } = new URL(urlStr)
        return href && origin && host && hostname && pathname && true
    } catch (e) {
        return false
    }
}

[SuAgnes]

 /^(https?:\/\/)?([a-z0-9]\.|[a-z0-9][-a-z0-9]*[a-z0-9]\.)*([a-z]+)(:\d+)?(\/.*)?$/;

[wulichenyang]

const isUrl = urlStr => {
    try {
        const { href, origin, host, hostname, pathname } = new URL(urlStr)
        return href && origin && host && hostname && pathname && true
    } catch (e) {
        return false
    }
}

可能还需要检查一下protocol是http|https

[yuwanli]

/^(?:(https?):)?(?:\/\/)?([^\/?#:]+)?(?::(\d+))?([^?#]*)(?:\?([^#]*))?(?:#(.*))?$/

[CC712]

what is a URL from MDN
补个资料。
思路应该是对 URL的组成部分 分别进行校验

• protocol
• domain name
• port
• path （不用校验）
• params
• anchor （不用校验）

[yaodongyi]

let url = 'https://www.baidu.com';
function searchUrl(url) {
    try {
        if (new URL(url) && (new URL(url).protocol === "http:" || new URL(url).protocol === "https:") && url.match(new RegExp(new URL(url).protocol + "//")).index === 0) return true
    } catch (err) {
        console.log("不是一个正确的网址");
    }
};
console.log(searchUrl(url))

[chenyueyun]

stackoverflow上的：

(https?|ftp|file)://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]