再上傳表情或者圖片地址時候很多時候不能直接上傳<img src=" " />，因此在上傳評論或者圖片之前應該先處理一下img標籤。舉例如下，希望可以協助更多的程式猿~
<span style="font-size:14px;">//第一步是擷取到帶有img標籤的字串 var str = '圖片1<img src="arclist/sanai.png">圖片2<img src="arclist/em_23.gif">圖片3<img src="arclist/451.gif">';</span>
處理擷取到的字串
<span style="font-size:14px;">//將img標籤替換為特定編碼方式的運算式 var reg = /<img[^>]*src[=\"\'\s]+[^\.]*\/([^\.]+)\.[^\"\']+[\"\']?[^>]*>/gi; str = str.replace(reg, "[face:$1.gif]"); console.log(str);</span>
運算結果為：
<span style="font-size:14px;">圖片1[face:sanai.gif]圖片2[face:em_23.gif]圖片3[face:451.gif]</span>
這樣上傳到伺服器的代碼就不會存在html標籤，這是一種很好的應對帶有圖片評論且上傳資訊禁止html標籤的方法。
接下來：
從伺服器上返回的上一步中的運行結果，在反向解析，方法如下：
<span style="font-size:14px;">//將特定編碼方式替換成img標籤的運算式 var regg = /face:([\w]+).gif/gi; str = str.replace(regg,"<img src='images/$1.gif' />"); console.log(str);</span>
運行結果為：
<span style="font-size:14px;">圖片1<img src='images/sanai.gif' />圖片2<img src='images/em_23.gif' />圖片3<img src='images/451.gif' /></span>
下面附上代碼的html頁，可以全部複製粘貼到html檔案中直接運行，親測可用
<span style="font-size:14px;"><!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script> var str = '圖片1<img src="arclist/sanai.png">圖片2<img src="arclist/em_23.gif">圖片3<img src="arclist/451.gif">'; //將img標籤替換為特定編碼方式的運算式 var reg = /<img[^>]*src[=\"\'\s]+[^\.]*\/([^\.]+)\.[^\"\']+[\"\']?[^>]*>/gi; str = str.replace(reg, "[face:$1.gif]"); console.log(str); //將特定編碼方式替換成img標籤的運算式 var regg = /face:([\w]+).gif/gi; str = str.replace(regg,"<img src='images/$1.gif' />"); console.log(str); </script> </body> </html></span>
以上兩種方法很好的解決的對img標籤的正反運算，第一種方法為之前收集，不記得原作者，如有冒犯可以提出署名。後一種方法為本人自寫，存在一定的局限性，歡迎大家討論~
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
