Unicodeでのバックスラッシュと¥の違い

とても恥ずかしいのですが、今さらバックスラッシュと¥の違いを身をもって体験しました。MacIE対策でバックスラッシュハックを使おうとして、ハマってしまったのです。

調べてみると、色々なことが分かりました。

  • Mac環境のUTF-8では、バックスラッシュは¥とは違う扱いになる。
  • Unicodeで書く場合、Windows環境だと¥はバックスラッシュに変換されるが、Mac環境では変換されず、¥は¥マークとして扱われる。
  • Osakaフォントなどで表示していると、¥もバックスラッシュも同じ「¥」表示になるため、見分けがつかない。(「Courier」フォントなどで表示すると見分けがつく)
  • Mac環境でバックスラッシュを入力するには、日本語入力の状態で「Option + ¥」。

Mac環境でバックスラッシュだと思って¥を入力しておくと、バックスラッシュハックなんかが効かなくなります。UTF-8でサイトを作っている時は要注意ですね。。

ちなみにHTML文書で¥を表示させたい場合は実態参照で¥です。

参考
UTF-8のバックスラッシュは¥ではない (kakitomeru note)
バックスラッシュ問題@MacOSX@KADOYAN.com
Dreamweaver8ハマりどころ 06.09.01 – Memo:hbworks
円記号 – Wikipedia
バックスラッシュ – Wikipedia
日本語環境でのUnicodeの諸問題 | Unicode – Wikipedia

2008年もよろしくお願いいたします

あけましておめでとうございます。Like@Lunaticを本年もどうぞよろしくお願いいたします。
いきなりではありますが、私の本年の抱負を表明させていただきます。

  1. 習得言語を増やす(もちろんここでいう"言語"とは"コンピューター言語"です)
  2. 作業環境の改善、最適化、そして作業の高速化
  3. 新しい作業環境への適応

当サイトで取り上げても良さそうなものは以上の3点となります。これをより具体的に書きますと、

  1. (X)HTML+CSSのコーディングレベルを上げると同時に、次期バージョン(CSS3など)を視野に入れてみる
  2. JavaScriptのコーディングレベルを上げる
  3. PHPを一から勉強
  4. XMLをぼちぼちやるかも
  5. WindowsからMacへのメイン制作環境の移行
  6. Vimを使いこなせるようになる

・・・といったところです。

ほかにもActionScriptや、Adobe AIR、Silverlightなど、興味のあるテクノロジーはたくさんあります。……が、もともと私はあまり器用な性格でありませんから、できることからコツコツとやろうと思います。改善や学習の過程で何かご提供できそうなネタや、書き留めておきたいネタがある場合は記事として投稿してまいります。

今までにここでは特に公表はしておりませんでしたが、昨年からMdNスクール・オブ・デザインにて講師を勤めさせていただいております。講師としての業務が板につくよう、こちらでも努力してまいります。

本年もどうぞよろしくお付き合いください。

『Javascript で HTMLエスケープを行うPHP関数、htmlspecialchars を実装』に一行追加

phpspot開発日誌さんJavascript で HTMLエスケープを行うPHP関数、htmlspecialchars を実装で紹介されているコードを使ってみたところ、不満な点が出てきたのでちょっぴり改良して使っています。

不満な点とは、既に「&」となっているコードを放り込むと、「&」と二重変換されてしまう点。改良後のコードは以下です。

function htmlspecialchars(ch) {
ch = ch.replace(/&/g,"&");
ch = ch.replace(/&/g,"&");
ch = ch.replace(/"/g,""");
ch = ch.replace(/'/g,"'");
ch = ch.replace(/</g,"&lt;");
ch = ch.replace(/>/g,"&gt;");
return ch;
}

追加したのは3行目。二重変換されちゃったものは元に戻すという、それだけです。

IEのDOMで特徴的だと思ったこと3点

最近、職場で勉強がてらJavaScriptでプログラムを書いています。会社の案件では少しjQueryを触ったりしたのですが、こちらではライブラリは極力使わない方針で。
そんな中、いくつか気づいたことを書き留めておきます。今回はIEの挙動で、特徴的だと思った点を3点。

responseXMLされたテキストノードをappendChildしようとするとエラーになる

Ajax通信したものをresponseXMLで受け取り、そこからテキストノードを抜き出して、createElementしたコンテナ要素にappendChildしようとすると、IEでは何故かエラーになりました。

回避方法:

// hogeが該当のテキストノード
var fuga = document.createTextNode(hoge.nodeValue)
container.appendChild(fuga)

周りくどいですが、テキストノードのnodeValue(テキストそのもの)を取り出して改めてcreateTextNodeします。これだけで解決。

table要素をcreateElementする際、子要素にtbodyを作らないとダメ

FirefoxとかOperaは、こっちがわざわざ作らなくても仮想的にtbodyを作ってDOMツリーを構成してくれます。だけどIEの場合はtbodyもこっちが作らないとダメ。作らなかった場合は不完全な要素ノードとなるため、appendChildとかしても何も表示されません。

そんな情報を検索している時に発見した、珍しいメソッドがtBodies[]

tBodies[]
table要素ノードのメソッド。tbody要素をノードリストで返す。
tableElement.tBodies[0]みたいにして使います。まぁ、tableElement.getElementsByTagName("tbody")[0]と書いても同じなわけですけど・・・。

参考:tBodies Collection (TABLE) – MSDN

要素ノードリストのアイテムにインデックス番号を振る際、 変数に格納した数値を入れるとエラーになることがある

解決方法:
とりあえずitem()メソッドで書けばOK

他のコードでも書いてみましたが、エラーが再現できず・・・どういう条件が重なると引き起こるのかよく分かりません。

MT4導入

ようやく重い腰を上げ、MovableType4を導入しました。
SQLiteからMySQLにDBを移行したため、かなり面倒な作業になってしまいました。もう2度とやりたくない感じです(トホホ・・・)。

とりあえず、大きな発見があったこととしては、MT4が各エントリーに勝手に振るIDは振り直せるということです。これはMySQL環境だからできたことですが・・・phpMyAdminからmt_entryというテーブルを見つけて、こいつの中身を空にしちゃいます。それから改めてエントリーをインポートするだけ。

気が向いたら、別の記事に詳しくまとめるかも。今日はもう書く気力が残っていません。。

追記– 2007年4月23日(月)

phpMyAdminから直接DBをいじったせいか、アーカイブのエントリーの書き出され方がおかしくなったりと怪しいトラブルが発生していました。インポートを再びする関係上、コメントやトラックバックのIDも振り直さなければならなかったり・・・といろいろ面倒なことになってしまい、結局DBテーブルをクリアしてMT4のインストールから全部やり直しましたorz
生半可な知識でDBを直接いじるのは危険なんだな・・・と反省。IDの振り直しの話はやはりなかったことにしといてください・・・。