javascript的encodeURIComponent

本系列文章是本人學習相關知識時所積累的筆記，以記錄自己的學習歷程，也爲了方便回顧知識；故文章內容較爲隨意簡練，抱着學習目的來的同學務必轉移他處，以免我誤人子弟~

參考資料：
MDN：encodeURIComponent

工作中碰到問題：
某個元素的 background-image 的值 url() 中的值是經過 encodeURIComponent 處理的圖片路徑；如果圖片路徑中包含着英文括號()則 encodeURIComponent 無法將英文括號轉義，即 好123(2).jpg 只能變成 %E5%A5%BD123(2).jpg

問題就在於這樣的話圖片路徑被當成非法的，導致圖片無法在瀏覽器中顯示
查看了 MDN 文檔才知道，encodeURIComponent 會忽略字母、數字、(、)、.、!、~、*、'、-和_，所以給出一個較爲安全的辦法：

function fixedEncodeURIComponent (str) {
  return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
    return '%' + c.charCodeAt(0).toString(16);
  });
}

手動轉義，使用到項目中可以解決問題

注：，圖片存放在cdn上，屬於http請求，可能跟background-image的url加載圖片的方式有關