一、部分正則語法介紹html
\s 匹配任何空白字符，包括空格、製表符、換頁符等等。等價於 [ \f\n\r\t\v]。正則表達式
? 匹配前面的子表達式零次或一次，或指明一個非貪婪限定符。要匹配 ? 字符，請使用 \?。數組
| 指明兩項之間的一個選擇。要匹配 |，請使用 \|。緩存
. 匹配除換行符 \n 以外的任何單字符。要匹配 . ，請使用 \. 。post
g 全文搜索regexp
i 忽略大小寫htm
詳情可參考 http://www.runoob.com/regexp/regexp-syntax.htmlblog
二、match 方法介紹字符串
詳情參考：http://www.w3school.com.cn/jsref/jsref_match.aspget
三、使用正則表達式獲取全部 img 標籤
從圖中能夠看出，使用正則表達式 /<img\b.*?(?:\>|\/>)/gi 能夠將字符串中的 img 標籤進行匹配，並放到一個新數組中
關於 正則表達式 /<img\b.*?(?:\>|\/>)/gi 的解釋
首先 標籤的開始是 <
其後緊跟着 img
故使用 /<img\b 進行匹配
.*? 則對字符串進行最小匹配（下一個匹配(?:\>|\/>)出現時，.* 就失效）
img 標籤結尾 使用 > 或者 /> ，使用 (?:\>|\/>) 進行匹配
注：圓括號（）會有一個反作用，是相關的匹配會被緩存，此時可用?:放在第一個選項前來消除這種反作用。
四、獲取 img 標籤對應的 src 屬性
從圖中能夠看出，使用正則表達式 /\bsrc\b\s*=\s*[\'\"]?([^\'\"]*)[\'\"]?/i 能夠將字符串中的 img 標籤進行匹配，並放到一個新數組中，數組下標爲1，就是所須要的src屬性
關於 正則表達式 /\bsrc\b\s*=\s*[\'\"]?([^\'\"]*)[\'\"]?/i 的解釋
\bsrc\b 是把src當成一個單詞進行匹配
\s*=\s* 則是匹配 = 先後是否有空格（* 爲0個以上，包括0）
[\'\"]? 進行最小匹配，src 通常用單引號或雙引號包裹
([^\'\"]*) 匹配不上單引號和雙引號的字符
注：這裏沒有使用 g 進行全局匹配，是由於 img 標籤只有一個 src ，匹配到就能夠結束了
五、總結
使用 /<img\b.*?(?:\>|\/>)/gi 對一個字符串進行全文匹配，獲取所須要的 img 標籤
使用 /\bsrc\b\s*=\s*[\'\"]?([^\'\"]*)[\'\"]?/i 對一個 img 標籤進行匹配，獲取所對應的 src 屬性
注：由於我的書寫手法的不一致，實際過程當中坑你須要去除 \b \s 等一些特性限制，需根據實際須要進行修改
原文地址：http://www.cnblogs.com/ImCehnyx/p/7163691.html