主頁(yè) > 知識(shí)庫(kù) > 正則表達(dá)式處理圖片地址、img標(biāo)簽的方法

正則表達(dá)式處理圖片地址、img標(biāo)簽的方法

熱門標(biāo)簽:團(tuán)購(gòu)網(wǎng)站 Mysql連接數(shù)設(shè)置 服務(wù)器配置 電子圍欄 科大訊飛語(yǔ)音識(shí)別系統(tǒng) 銀行業(yè)務(wù) Linux服務(wù)器 阿里云

再上傳表情或者圖片地址時(shí)候很多時(shí)候不能直接上傳img src=" " />,因此在上傳評(píng)論或者圖片之前應(yīng)該先處理一下img標(biāo)簽。舉例如下,希望可以幫助更多的程序猿~

span style="font-size:14px;">//第一步是獲取到帶有img標(biāo)簽的字符串 
var str = '圖片1img src="arclist/sanai.png">圖片2img src="arclist/em_23.gif">圖片3img src="arclist/451.gif">';/span> 

處理獲取到的字符串

span style="font-size:14px;">//將img標(biāo)簽替換為特定編碼方式的表達(dá)式 
var reg = /img[^>]*src[=\"\'s]+[^\.]*/([^\.]+).[^\"\']+[\"\']?[^>]*>/gi; 
str = str.replace(reg, "[face:$1.gif]"); 
console.log(str);/span> 

運(yùn)算結(jié)果為:

span style="font-size:14px;">圖片1[face:sanai.gif]圖片2[face:em_23.gif]圖片3[face:451.gif]/span> 

這樣上傳到服務(wù)器的代碼就不會(huì)存在html標(biāo)簽,這是一種很好的應(yīng)對(duì)帶有圖片評(píng)論且上傳信息禁止html標(biāo)簽的方法。

接下來(lái):

從服務(wù)器上返回的上一步中的運(yùn)行結(jié)果,在反向解析,方法如下:

span style="font-size:14px;">//將特定編碼方式替換成img標(biāo)簽的表達(dá)式 
var regg = /
face:([\w]+).gif
/gi; 
str = str.replace(regg,"img src='images/$1.gif' />"); 
console.log(str);/span> 

運(yùn)行結(jié)果為:

span style="font-size:14px;">圖片1img src='images/sanai.gif' />圖片2img src='images/em_23.gif' />圖片3img src='images/451.gif' />/span> 

下面附上代碼的html頁(yè),可以全部復(fù)制粘貼到html文件中直接運(yùn)行,親測(cè)可用

span style="font-size:14px;">!DOCTYPE html> 
html> 
 head> 
  meta charset="UTF-8"> 
  title>/title> 
 /head> 
 body> 
  script> 
   var str = '圖片1img src="arclist/sanai.png">圖片2img src="arclist/em_23.gif">圖片3img src="arclist/451.gif">'; 
   //將img標(biāo)簽替換為特定編碼方式的表達(dá)式 
   var reg = /img[^>]*src[=\"\'\s]+[^\.]*/([^\.]+).[^\"\']+[\"\']?[^>]*>/gi; 
   str = str.replace(reg, "[face:$1.gif]"); 
   console.log(str); 
   //將特定編碼方式替換成img標(biāo)簽的表達(dá)式 
   var regg = /
face:([\w]+).gif
/gi; 
   str = str.replace(regg,"img src='images/$1.gif' />"); 
   console.log(str); 
  /script> 
 /body> 
/html>/span> 

以上兩種方法很好的解決的對(duì)img標(biāo)簽的正反運(yùn)算,第一種方法為之前收集,不記得原作者,如有冒犯可以提出署名。后一種方法為本人自寫,存在一定的局限性,歡迎大家討論~

以上所述是小編給大家介紹的正則表達(dá)式處理圖片地址、img標(biāo)簽的方法,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!

您可能感興趣的文章:
  • 用正則表達(dá)式替換圖片地址img標(biāo)簽
  • JavaScript正則表達(dá)式替換字符串中圖片地址(img src)的方法
  • 正則表達(dá)式提取img的src
  • php正則表達(dá)式匹配img中任意屬性的方法

標(biāo)簽:大理 萍鄉(xiāng) 衢州 蚌埠 江蘇 衡水 廣元 棗莊

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《正則表達(dá)式處理圖片地址、img標(biāo)簽的方法》,本文關(guān)鍵詞  ;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無(wú)關(guān)。
  • 相關(guān)文章
  • 收縮
    • 微信客服
    • 微信二維碼
    • 電話咨詢

    • 400-1100-266