记录下两个正则表达式的使用

作者:Ghost 来源:css森林 时间:2009-11-30 12:56:00 

昨天在做mergeCSS的时候遇到两个正则匹配的问题,也花了不少的时间,最后在CSS森林群的 CE 同学帮助下,才完成了这俩正则,特别记录下,以后可能也会用到。

第一个是匹配图片路径的问题,要处理的字符串是:

background:url(demo.jpg);background-image:url(demo.gif);

我一开始写的是:

url\((.*)\)得到的结果为:

url(demo.jpg);background-image:url(demo.gif);

可以看到,把两个图片匹配成了一个,结果不是所希望得到的。把它改为惰性匹配,如下:

url\((.*?)\)

得到的结果为:

url(demo.jpg);
url(demo.gif);

匹配到了两个图片,是所要的结果了。:)

第二个问题是正则表达式中使用变量的问题,简单解释下为什么加变量也会成为问题,先看下 RegExp 对象 和 replace() 方法 的说明,Javascript的正则一般的书写方式是:

/正则表达式/匹配模式所有在“/”中间的内容都会被当成正则表达式,于是变量名也就被当成字符串了。不加“/”?也行,不过不加“/”的话就不能指定匹配模式,也就只能匹配到第一个。

通过RegExp对象可以生成一个新的 RegExp 对象,具有指定的模式和标志。
于是:

new RegExp("url\\((" + 变量名 + ")\\)", "g");

这里要注意的是使用“\\”的方式的方式进行转义,因为

如果参数 pattern 是正则表达式而不是字符串,那么 RegExp() 构造函数将用与指定的 RegExp 相同的模式和标志创建一个新的 RegExp 对象。

这个过程中“\\”会被转换成“\”,即上面的结果是:

/url\((变量内容)\)/g

标签:正则表达式,CSS,RegExp
0
投稿

猜你喜欢

  • jsSmarty Project

    2009-10-19 23:14:00
  • 艺术和设计之间的差别

    2010-11-17 19:28:00
  • 由浅入深讲解MySQL数据库索引的选择性

    2008-12-17 15:06:00
  • JavaScript caller与callee属性

    2009-01-19 13:39:00
  • Oracle数据安全面面观

    2010-07-27 13:27:00
  • Mootools 1.2教程(10)——Fx.Tween的使用

    2008-12-02 18:03:00
  • sqlserver合并DataTable并排除重复数据的通用方法分享

    2012-01-05 18:59:56
  • MySQL中delimiter的作用

    2010-10-25 20:26:00
  • XHTML1.0规范:您是否为img图片标签赋予alt属性

    2009-09-21 11:11:00
  • Windows mysql命令行导入 .sql文件

    2010-12-03 16:12:00
  • 擦亮自己的眼睛去看SQL Server之历史渊源

    2011-08-29 15:40:53
  • form 元素内的字段 name 不要跟 form 属性名称一致

    2008-10-22 13:25:00
  • 交互设计实用指南系列(2) –可及

    2010-01-21 12:48:00
  • 商品评论的设计

    2009-12-23 13:06:00
  • 品牌的统一体验

    2010-05-19 13:08:00
  • CSS 表格元素内容的定位 0

    2008-08-01 17:31:00
  • 小诀窍让你快速上手Dreamweaver

    2007-12-03 11:35:00
  • 用CSS实现柱状图(Bar Graph)的方法(二)—基于表格元素的柱状图

    2008-05-26 13:23:00
  • 仿迅雷焦点广告效果(JQuery版)

    2009-08-03 14:18:00
  • 什么是gzip,人肉gzip?

    2008-11-20 13:01:00
  • asp之家 网络编程 m.aspxhome.com