JavaScript实现url地址自动检测并添加URL链接示例代码


Posted in Javascript onNovember 12, 2013

背景:写一个简单的聊天系统,发出Htpp的Url实现跳转加上a标签。
实现代码:

String.prototype.httpHtml = function(){ 
var reg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g; 
return this.replace(reg, '<a target=_blank href="$1$2">$1$2</a>'); 
};

摘录:
URL地址自动添加的实现
URL地址自动添加的实现其实就是那么点内容:检测与替换。

检测
“检测”就是检测文字(字符串)内部是否有符合http地址的内容,显然,这需要用到正则表达式进行验证,这个工作前端和后台都可以做,这里,只讲前端的方法,使用JavaScript实现。
验证HTTP地址的正则表达式如下(可能有疏漏或是不准确之处,欢迎指正):
var reg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g;
前一部分匹配http或是https开头的URL字符串地址,后面一部分匹配一些字符,英文字符、下划线(_)、点号(.)、问号(?)以及等号(=),连接短线(-)等。

替换
说到JavaScript中的替换功能,首先想到的自然是replace属性了,replace属性强大之处在于其支持正则表达式,可以对符合正则的字符串进行替换。例如,我们要替换掉字符串两端的空格就可以使用类似下面的语句:

var s = " blank "; 
s = s.replace(/^\s+(.*?)\s+$/, ""); 
alert(s);
Javascript 相关文章推荐
javascript+xml技术实现分页浏览
Jul 27 Javascript
jquery实现奇偶行赋值不同css值
Feb 17 Javascript
javascript生成json数据简单示例分享
Feb 14 Javascript
使用JSON.parse将json字符串转换成json对象的时候会出错
Sep 04 Javascript
node.js中实现同步操作的3种实现方法
Dec 05 Javascript
jqgrid实现简单的单行编辑功能
Sep 30 Javascript
最实用的JS数组函数整理
Dec 05 Javascript
原生JS进行前后端同构
Apr 22 Javascript
JSON字符串操作移除空串更改key/value的介绍
Jan 05 Javascript
微信小程序使用wxParse解析html的方法示例
Jan 17 Javascript
在微信小程序中使用图表的方法示例
Apr 25 Javascript
vue中keep-alive,include的缓存问题
Nov 26 Javascript
JavaScript改变HTML元素的样式改变CSS及元素属性
Nov 12 #Javascript
屏蔽script注入小例子
Nov 12 #Javascript
js控制淡入淡出示例代码
Nov 12 #Javascript
jquery给图片添加鼠标经过时的边框效果
Nov 12 #Javascript
JavaScript中for..in循环陷阱介绍
Nov 12 #Javascript
javascript控制Div层透明属性由浅变深由深变浅逐渐显示
Nov 12 #Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
Nov 12 #Javascript
You might like
php数据结构与算法(PHP描述) 查找与二分法查找
2012/06/21 PHP
Laravel实现定时任务的示例代码
2017/08/10 PHP
破解Session cookie的方法
2006/07/28 Javascript
JavaScript window.setTimeout() 的详细用法
2009/11/04 Javascript
jquery实现点击TreeView文本父节点展开/折叠子节点
2013/01/10 Javascript
js中的this关键字详解
2013/09/25 Javascript
document.addEventListener使用介绍
2014/03/07 Javascript
javascript关于继承的用法汇总
2014/12/20 Javascript
Node.js 学习笔记之简介、安装及配置
2015/03/03 Javascript
url传递的参数值中包含&amp;时,url自动截断问题的解决方法
2016/08/02 Javascript
谈谈对JavaScript原生拖放的深入理解
2016/09/20 Javascript
微信小程序三级联动地址选择器的实例代码
2017/07/12 Javascript
jQuery中图片展示插件highslide.js的简单dom
2018/04/22 jQuery
node中使用es6/7/8(支持性与性能)
2019/03/28 Javascript
基于JS开发微信网页录音功能的实例代码
2019/04/30 Javascript
JavaScript实现滑动门效果
2020/01/18 Javascript
[07:31]DOTA2卡尔工作室 英雄介绍主宰篇
2013/06/25 DOTA
[01:09:16]DOTA2-DPC中国联赛 正赛 SAG vs Dynasty BO3 第一场 1月25日
2021/03/11 DOTA
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
python获取当前计算机cpu数量的方法
2015/04/18 Python
python实现给数组按片赋值的方法
2015/07/28 Python
使用python编写udp协议的ping程序方法
2018/04/22 Python
Python针对给定列表中元素进行翻转操作的方法分析
2018/04/27 Python
python用插值法绘制平滑曲线
2021/02/19 Python
利用pyecharts读取csv并进行数据统计可视化的实现
2020/04/17 Python
Python获取浏览器窗口句柄过程解析
2020/07/25 Python
Python word文本自动化操作实现方法解析
2020/11/05 Python
css3中transition属性详解
2014/09/02 HTML / CSS
秋季运动会广播稿大全
2014/02/17 职场文书
股份合作协议书
2014/04/12 职场文书
优秀大专毕业生求职信
2014/08/04 职场文书
2014年维修电工工作总结
2014/11/20 职场文书
保安辞职信范文
2015/02/28 职场文书
学习心理学心得体会
2016/01/22 职场文书
60条职场经典语录,总有一条能触动你的心
2019/08/21 职场文书
python APScheduler执行定时任务介绍
2022/04/19 Python