正则表达式替换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 图像裁剪插件Jcrop的简单使用
May 22 Javascript
jQuery的Ajax的自动完成功能控件简要说明
Feb 22 Javascript
判断是否安装flash player及当前版本的JS代码
Aug 08 Javascript
jQuery ajax dataType值为text json探索分享
Sep 23 Javascript
JS获取月的最后一天与JS得到一个月份最大天数的实例代码
Dec 16 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
Apr 01 Javascript
jquery实现弹窗功能(窗口居中显示)
Feb 27 Javascript
使用node.js搭建服务器
May 20 Javascript
jQuery EasyUI的TreeGrid查询功能实现方法
Aug 08 jQuery
angularJs中$scope数据序列化的实例
Sep 30 Javascript
vue-router重定向和路由别名的使用讲解
Jan 19 Javascript
js array数组对象操作方法汇总
Mar 18 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
Discuz 模板语句分析及知识技巧
2009/08/21 PHP
用php或asp创建网页桌面快捷方式的代码
2010/03/23 PHP
如何使用Strace调试工具
2013/06/03 PHP
基于empty函数的输出详解
2013/06/17 PHP
彻底删除thinkphp3.1案例blog标签的方法
2014/12/05 PHP
对laravel的csrf 防御机制详解,及form中csrf_token()的存在介绍
2019/10/24 PHP
JQuery 常用方法基础教程
2009/02/06 Javascript
jQuery 源代码显示控件 (Ajax加载方式).
2009/05/18 Javascript
js或css实现滚动广告的几种方案
2010/01/28 Javascript
JavaScript具有类似Lambda表达式编程能力的代码(改进版)
2010/09/14 Javascript
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
2012/06/14 Javascript
jquery网页元素拖拽插件效果及实现
2013/08/05 Javascript
ExtJS4中使用mixins实现多继承示例
2013/12/03 Javascript
jQuery解析XML文件同时动态增加js文件的方法
2015/06/01 Javascript
JS+CSS实现的蓝色table选项卡效果
2015/10/08 Javascript
jQuery限制图片大小的方法
2016/05/25 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
2016/06/22 Javascript
vue中SPA单页面应用程序详解
2017/11/07 Javascript
JS简单获得节点元素的方法示例
2018/02/10 Javascript
js中对象和面向对象与Json介绍
2019/01/21 Javascript
Vue开发之封装上传文件组件与用法示例
2019/04/25 Javascript
vue实现标签云效果的方法详解
2019/08/28 Javascript
使用vue实现通过变量动态拼接url
2020/07/22 Javascript
JavaScript实现简单日历效果
2020/09/11 Javascript
在Python的Flask框架中实现全文搜索功能
2015/04/20 Python
flask + pymysql操作Mysql数据库的实例
2017/11/13 Python
Python实现的摇骰子猜大小功能小游戏示例
2017/12/18 Python
Django rest framework实现分页的示例
2018/05/24 Python
Python线程同步的实现代码
2018/10/03 Python
numpy.linalg.eig() 计算矩阵特征向量方式
2019/11/29 Python
李维斯德国官方网上商店:Levi’s德国
2016/09/10 全球购物
巴基斯坦电子产品购物网站:Home Shopping
2017/09/14 全球购物
实习老师个人总结的自我评价
2013/09/28 职场文书
动物科学专业毕业生的自我评价
2013/11/29 职场文书
鸡毛信观后感
2015/06/11 职场文书
浅谈JS的原型和原型链
2021/06/04 Javascript