【干货】js判断url是否是合法http/https

最新推荐文章于 2023-06-21 11:54:58 发布

未名编程

最新推荐文章于 2023-06-21 11:54:58 发布

阅读量1.4w

点赞数 7

分类专栏：前端文章标签： js 正则表达式

本文链接：https://blog.csdn.net/qq_44275213/article/details/110527407

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

核心代码

function checkURL(URL){
var str=URL;
//判断URL地址的正则表达式为:http(s)?://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?
//下面的代码中应用了转义字符"\"输出一个字符"/"
var Expression=/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
var objExp=new RegExp(Expression);
if(objExp.test(str)==true){
return true;
}else{
return false;
}
}

测试

代码

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>未名编程</title>
</head>

<body>
网址必须以http://或者https://开头，且必须是个网址^_^！<br />
<input type="text" id="url" />
<button onclick="CheckUrl()">确定</button>
 <script>
function CheckUrl(){
 var url=document.getElementById("url").value;
 var reg=/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
 if(!reg.test(url)){
 alert("这网址不是以http://https://开头，或者不是网址！");
 }
 else{
 alert("输入成功");
 }
}
</script>
</body>
</html>

结果

在这里插入图片描述

解释

/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/

在这里插入图片描述

- Javascript之中，由于所有变量都是var，因此正则表达式必须写在两个斜杠之中，/.../，然后正则表达式里面的斜杠/必须写成 \/
- http(s)?://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?
- []表示一个检验单位，也就是某个字符可以容纳的东西。
- ([A-Za-z0-9-~]+)表示，包括这个字符及其随后的字符都必须大写字母、小写字母、数字、减号-或者是~
 字符+的意思是：匹配+号前面的字符1次或n次，例如：/a+/匹配"candy"中的'a'和"caaaaaaandy"中的所有'a'.
- 因此(([A-Za-z0-9-~]+)\.)+则表示XXX.这个以点结尾的东西，必须在([A-Za-z0-9-~\/])+$这个字符前面出现至少1次

未名编程

关注

7
点赞
踩
25

收藏

觉得还不错? 一键收藏
打赏
0
评论
【干货】js判断url是否是合法http/https

function checkURL(URL){var str=URL;//判断URL地址的正则表达式为:http(s)?://([\w-]+\.)+[\w-]+(/[\w- ./?%&=]*)?//下面的代码中应用了转义字符"\"输出一个字符"/"var Expression=/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;var objExp=new RegExp(Expression);if(objExp.test(st
复制链接

扫一扫