幾個製作 Blogger 網頁時遇到的問題

在製作彩油的展示與選取頁面時, 遇到不少問題, 在此記錄:



* Blogger 使用的是 UTF8 格式的檔案, .js 檔案內可能會有中文資料, 若不是以 UTF8 存檔, 可能會造成執行時期的錯誤.



* Blogger 內的文章可以貼入 <script>....</script>, 但卻不可貼入 <style>...</style>, Blogger 會自動將 <style> 及其內的所有資料全部移除, 所以放了也沒用. 因此 <style> 變成只能靠修改 template 置入. 但 template 卻是所有文章共用的區域, 久了不但 template 會變得複雜混亂, 也會使整體網頁顯示變慢. 拜這個問題所賜, 讓我找到了動態讀取 css 及 javascript 檔案的方法:

function loadCSS(css_filename) {
  var css=document.createElement('link');
  css.setAttribute('rel', 'stylesheet');
  css.setAttribute('type', 'text/css');
  css.setAttribute('href', css_filename);
  document.getElementsByTagName('head')[0].appendChild(css);
}
function loadScript(script_filename) {  
  var js = document.createElement('script');
  js.setAttribute('language', 'javascript1.2');
  js.setAttribute('type', 'text/javascript');
  js.setAttribute('src', script_filename);
  document.getElementsByTagName('head')[0].appendChild(js);
}  

呼叫上述的 code, 就可以擺脫使用 html tag 載入 css 與 js 的命運, 以 javascript 來呼叫載入.

update:沒多久就發現其實 jQuery 早已有 require 的 plugin, 真好. 不過目前暫時先用上面的方案就好了.



* 在使用 thickbox plugin 時遇上了奇怪的問題, 後來發現是 thickbox 內呼叫 jQuery 的 $("...").load 方法載入 html 檔案, 在這裡某些時候有問題. 這個方法使用形式是 load( url, params, callback ), 問題在 url 參數. 若傳入 url 是完整的, 像 "http://domain.com/html/page.html" 的話, 就會有點像當掉一樣, 停留在這裡; 若 url 只傳檔案名稱, 像 "page.html" 的話, 就可正常執行. 為什麼目前不得而知, 只好暫時避免以 ajax 的方式使用 thickbox, 改用 inline 的方式就沒問題了, iframe 的方式則還沒用過.