Introduction

ブログ内検索

  • このサイトの記事を検索 by Google

おすすめの一冊!

無料ブログはココログ

« セキュリティソフトは最新版を | トップページ | CSS ルールの動的な追加 »

2011-05-05

script 要素の charset 属性


ちょっとしたブックマークレット (bookmarklet) を作ってます。

  ⇒ PruneBeforeClip

Evernote の web clipper で「本文だけをクリップ」するために
ページを整形してくれる、というだけのモノですが、なかなか便利。


で、まだ対応サイトが少ないので、毎日ちょっとずつコードを追加しているのですが、
今日になって突然、Firefox で動かなくなってしまいました。

このブックマークレットでは、外部 JavaScript ファイルを読み込む script 要素を
ページに埋め込んでいます。実際の処理(ページの加工)は、この外部 JavaScript
ファイルに書かれています。Firebug で調べてみると、script 要素の埋め込みは
できているみたいですが、JavaScript ファイルが実行されなくなってしまったみたい。

Google Chrome では動くのでしばらく悩んだのですが、「もしや」と思って
コメントを全部削除してみたら、Firefox でも動きました。


犯人は文字コード。


JavaScript ファイルの文字コードは UTF-8N にしていたのですが、
加工したいページの HTML ファイルは Shift-JIS になっていて、
Firefox は Shift-JIS だと思って JavaScript ファイルを処理して、
たまたま不正なコードを検出してお亡くなりになっていたようです。
昨日まで動いていたのは、たまたま不正なコードとなりうる漢字を
使っていなかっただけみたいです。運が良かったのか悪かったのか。

さっそくググってみると、script 要素には charset 属性が指定できる、
ということがわかりました。
文字コードの違う外部JavaScriptファイルを読み込む -- cafe-lab:lablog
ブックマークレットで生成する script 要素にも charset 属性を 指定するようにしたところ、Firefox でも動くようになりました。
javascript:(function(){ var elem = document.createElement('script'); elem.setAttribute('type', 'text/javascript'); elem.setAttribute('charset', 'UTF-8'); elem.setAttribute('src', 'http://prunebeforeclip.seaoak.jp/bookmarklet_01_00_00_00.js'); document.body.appendChild(elem); })();
カンペキです。 しかし、文字コードはホントにやっかいですね・・・

« セキュリティソフトは最新版を | トップページ | CSS ルールの動的な追加 »