使用 js+正则表达式为关键词添加链接


Posted in Javascript onNovember 11, 2014

要求把一段html脚本中的疾病名添加到疾病库的链接,只添加一次,要避开超链接或图片链接。

最初是用的    str.replace('糖尿病', '<a href=...>糖尿病</a>');

结果找了半天,愣是没找到替换后的效果,原来是有个图片的title中包含糖尿病,被它捷足先登了。

因此要把<a>链接、<img>标签避开,但<p><div>等标签不用避开

上图:

使用 js+正则表达式为关键词添加链接

 s = "<a href='http://www.yx129.com/bingli/1_310.html'>先看一个糖尿病病历</a> <br/>" +  

         "<IMG style='vertical-align:middle' width=40 src='http://yx129.com/api/minisite/images/skin/green/doctor_thumb_100.png'/>糖尿病王医生<br/>" +  

         "糖尿病简介<br/>糖尿病发病率<br/><a href='baidu.com'>糖尿病症状<br/>" +  

         "</a> ";  

 document.write(s);  

   

 a_reg = /<a(.*?)<\/a>/i;  //a链接的正则  

 img_reg = /<img(.*?)>/i; //图片链接的正则,防止图片的title,alt什么的属性包括疾病名而误替换  

 var ix = 0;  

   

 var arr_ele = [];  

 //先把<a><img>2类标签全部替换为{{index}},然后处理剩下的文字,再把<a><img>标签的内容替换回去  

 while(true){  

    if(-1 == s.toLowerCase().indexOf('<a ') && -1 == s.toLowerCase().indexOf('<img ')){  

        break;  

    }  

    a_match = s.match(a_reg);  

    if(a_match){  

        //console.log(a_match);  

        arr_ele.push(a_match[0]);  

        s = s.replace(a_reg, '{{' +ix+ '}}');  

        ix++;  

    }  

    img_match = s.match(img_reg);  

    if(img_match){  

        //console.log(img_match);  

        arr_ele.push(img_match[0]);  

        s = s.replace(img_reg, '{{' +ix+ '}}');  

        ix++;  

    }  

    console.log(s);  

}  

  

document.write('<br>-------------------------<br>第1步:把链接替换为{{index}}后:<br>'+s+'<br>');  

  

s = s.replace(/糖尿病/i, "<a target='_blank' href='http://jibing.yx129.com/tnb'>糖尿病</a>");  

  

document.write('<br>-------------------------<br>第2步:添加疾病库链接后:<br>'+s+'<br>');  

  

if(arr_ele){  

    for(var i=0; i<arr_ele.length; i++){  

        s = s.replace('{{' + i + '}}', arr_ele[i]);  

    }  

}  

  

document.write('<br>-------------------------<br>第3步:把链接替换回去之后:<br>'+s+'<br>');

以上就是使用 js+正则表达式为关键词添加链接的全部代码了,简单吧,有需要的小伙伴可以参考下

Javascript 相关文章推荐
用YUI做了个标签浏览效果
Feb 20 Javascript
childNodes.length与children.length的区别
May 14 Javascript
javascript 的Document属性和方法集合
Jan 25 Javascript
浅谈Javascript鼠标和滚轮事件
Jun 27 Javascript
Jquery实现鼠标移上弹出提示框、移出消失思路及代码
May 19 Javascript
javaScript 动态访问JSon元素示例代码
Aug 30 Javascript
Javascript数据结构与算法之列表详解
Mar 12 Javascript
jQuery实现的鼠标经过时变宽的效果(附demo源码)
Apr 28 Javascript
JS实现table表格固定表头且表头随横向滚动而滚动
Oct 26 Javascript
小程序点击图片实现自动播放视频
May 29 Javascript
elementui之el-tebs浏览器卡死的问题和使用报错未注册问题
Jul 06 Javascript
vue控制多行文字展开收起的实现示例
Oct 11 Javascript
jQuery 动态云标签插件
Nov 11 #Javascript
javascript 回调函数详解
Nov 11 #Javascript
JSON格式化输出
Nov 10 #Javascript
再谈javascript原型继承
Nov 10 #Javascript
让angularjs支持浏览器自动填表
Nov 10 #Javascript
使用cluster 将自己的Node服务器扩展为多线程服务器
Nov 10 #Javascript
前端必备神器 Snap.svg 弹动效果
Nov 10 #Javascript
You might like
Protoss热键控制
2020/03/14 星际争霸
PHP与SQL注入攻击[一]
2007/04/17 PHP
PHP中多维数组的foreach遍历示例
2014/06/13 PHP
php过滤表单提交的html等危险代码
2014/11/03 PHP
常见php数据文件缓存类汇总
2014/12/05 PHP
PHP中Http协议post请求参数
2015/11/02 PHP
PHP CURL中传递cookie的方法步骤
2019/05/09 PHP
php文件包含的几种方式总结
2019/09/19 PHP
在网页中使用document.write时遭遇的奇怪问题
2010/08/24 Javascript
JavaScript中获取元素索引的函数
2010/09/10 Javascript
jquery结合CSS使用validate实现漂亮的验证
2015/01/29 Javascript
详解Angular.js的$q.defer()服务异步处理
2016/11/06 Javascript
Angularjs处理页面闪烁的解决方法
2017/03/09 Javascript
Vue键盘事件用法总结
2017/04/18 Javascript
浅析Angular2子模块以及异步加载
2017/04/24 Javascript
JS使用插件cryptojs进行加密解密数据实例
2017/05/11 Javascript
3种vue组件的书写形式
2017/11/29 Javascript
vue组件文档(.md)中如何自动导入示例(.vue)详解
2019/01/25 Javascript
vue+vuex+json-seiver实现数据展示+分页功能
2019/04/11 Javascript
layer.prompt使文本框为空的情况下也能点击确定的方法
2019/09/24 Javascript
vue 使用饿了么UI仿写teambition的筛选功能
2021/03/01 Vue.js
python使用分治法实现求解最大值的方法
2015/05/12 Python
Python实现Smtplib发送带有各种附件的邮件实例
2017/06/05 Python
Python docx库用法示例分析
2019/02/16 Python
对python特殊函数 __call__()的使用详解
2019/07/02 Python
利用Pandas和Numpy按时间戳将数据以Groupby方式分组
2019/07/22 Python
python文件读取失败怎么处理
2020/06/23 Python
python exit出错原因整理
2020/08/31 Python
python实现图片转字符画
2021/02/19 Python
联想澳大利亚官网:Lenovo Australia
2018/01/18 全球购物
SOA的常见陷阱或者误解是什么
2014/10/05 面试题
广告学专业应届生求职信
2013/10/01 职场文书
小学生期末评语大全
2014/04/21 职场文书
化工实习心得体会
2014/09/09 职场文书
民主评议党员工作总结
2014/10/20 职场文书
基于Python实现一个春节倒计时脚本
2022/01/22 Python