正则表达式替换html元素属性的方法


Posted in Javascript onNovember 26, 2016

正则表达式替换任意html元素任意属性,或增加任意属性。

/**
 * 替换html中任意tag内任意attr值
 * @param src_str
 * @param tag
 * @param attr
 * @param val
 * @returns {*}
 */
replace_html_tag_attr: function(src_str, tag, attr, val) {
  if(typeof src_str === 'undefined' || typeof tag === 'undefined' || typeof attr === 'undefined' || typeof val === 'undefined') {
    return '';
  }

  var reg = new RegExp('<' + tag + '[^>]*(' + attr + '=[\'\"](\\w*%?)[\'\"])?[^>]*>', 'gi');
  return src_str.replace(reg, function (match) {
    if(match.indexOf(attr) > 0) {
      //包含attr属性,替换attr
      var sub_reg = new RegExp(attr + '=[\'\"](\\w*%?)[\'\"]', 'gi');
      return match.replace(sub_reg, attr +'=' + val);
    }else{
      //不包含attr属性,添加attr
      return match.substr(0, tag.length + 1) + ' ' + attr + '=' + val + ' ' + match.substr(tag.length + 2, match.length);
    }
  });
}

以上这篇正则表达式替换html元素属性的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery的链式调用浅析
Dec 03 Javascript
JavaScript操作XML 使用百度RSS作为新闻源示例
Feb 17 Javascript
jquery win 7透明弹出层效果的简单代码
Aug 06 Javascript
javascript深拷贝(deepClone)详解
Aug 24 Javascript
js Canvas实现圆形时钟教程
Sep 19 Javascript
setTimeout函数的神奇使用
Feb 26 Javascript
详解webpack 配合babel 将es6转成es5 超简单实例
May 02 Javascript
解决vue里碰到 $refs 的问题的方法
Jul 13 Javascript
微信公众号生成新浪短网址的实现(快速生成)
Aug 18 Javascript
WebStorm无法正确识别Vue3组合式API的解决方案
Feb 18 Vue.js
Angular性能优化之第三方组件和懒加载技术
May 10 Javascript
js初始化验证实例详解
Nov 26 #Javascript
浅谈js在html中的加载执行顺序,多个jquery ready执行顺序
Nov 26 #Javascript
JS匿名函数实例分析
Nov 26 #Javascript
利用Js的console对象,在控制台打印调式信息测试Js的实现
Nov 26 #Javascript
JS类的定义与使用方法深入探索
Nov 26 #Javascript
js控制台输出的方法(详解)
Nov 26 #Javascript
jQuery基于排序功能实现上移、下移的方法
Nov 26 #Javascript
You might like
PHP面向对象分析设计的61条军规小结
2010/07/17 PHP
php上传图片生成缩略图(GD库)
2016/01/06 PHP
php实现转换html格式为文本格式的方法
2016/05/16 PHP
Lumen timezone 时区设置方法(慢了8个小时)
2018/01/20 PHP
php报错502badgateway解决方法
2019/10/11 PHP
Ajax+Json 级联菜单实现代码
2009/10/27 Javascript
悄悄用脚本检查你访问过哪些网站的代码
2010/12/04 Javascript
实用的JS正则表达式(手机号码/IP正则/邮编正则/电话等)
2013/01/11 Javascript
jquery操作select详解(取值,设置选中)
2014/02/07 Javascript
Ajax局部更新导致JS事件重复触发问题的解决方法
2014/10/14 Javascript
JS实现向表格中动态添加行的方法
2015/03/30 Javascript
jQuery中bind(),live(),delegate(),on()绑定事件方法实例详解
2016/01/19 Javascript
一波JavaScript日期判断脚本分享
2016/03/06 Javascript
AngularJS出现$http异步后台无法获取请求参数问题的解决方法
2016/11/03 Javascript
Bootstrap学习笔记之进度条、媒体对象实例详解
2017/03/09 Javascript
jQuery选择器之属性筛选选择器用法详解
2017/09/19 jQuery
基于JavaScript实现五子棋游戏
2020/08/26 Javascript
原生JS实现多个小球碰撞反弹效果示例
2018/01/31 Javascript
Node.js中的不安全跳转如何防御详解
2018/10/21 Javascript
简单通过settimeout看javascript的运行机制
2019/05/10 Javascript
JS 实现发送短信验证码的“59秒后重新发送验证短信”功能
2019/08/23 Javascript
vue 实现cli3.0中使用proxy进行代理转发
2019/10/30 Javascript
js判断一个对象是数组(函数)的方法实例
2019/12/19 Javascript
JavaScript 接口原理与用法实例详解
2020/05/12 Javascript
python实现360皮肤按钮控件示例
2014/02/21 Python
详解Python中的静态方法与类成员方法
2017/02/28 Python
通过python实现弹窗广告拦截过程详解
2019/07/10 Python
pandas使用之宽表变窄表的实现
2020/04/12 Python
Selenium webdriver添加cookie实现过程详解
2020/08/12 Python
Python创建简单的神经网络实例讲解
2021/01/04 Python
我有一个梦想演讲稿
2014/05/05 职场文书
经典搞笑版检讨书
2015/02/19 职场文书
酒店人事主管岗位职责
2015/04/11 职场文书
用人单位聘用意向书
2015/05/11 职场文书
2016年第32个教师节致辞
2015/11/26 职场文书
mysql的Buffer Pool存储及原理
2022/04/02 MySQL