Prototype 1.6.0 のブラウザ判定と iPhone

Prototype 1.6.0 のブラウザ判定と iPhone

2007/09/01 8:30am

prototype.js には 1.5.1 から、各種ブラウザを判定するための Prototype.Browser が定義されている。

var Prototype = {
  ...
  Browser: {
    IE:     !!(window.attachEvent && !window.opera),
    Opera:  !!window.opera,
    WebKit: navigator.userAgent.indexOf('AppleWebKit/') > -1,
    Gecko:  navigator.userAgent.indexOf('Gecko') > -1 && navigator.userAgent.indexOf('KHTML') == -1,
  ...

使い方は一目瞭然だろう。

たとえば Internet Explorer の場合は Prototype.Browser.IE が、Safari など WebKit を利用しているブラウザでは Prototype.Browser.WebKit が true になる。

Prototype 1.6.0 RC での Prototype.Browser

そして、Prototype 1.6.0 RC では、ここに新しい定義が追加された。

iPhone だ。

var Prototype = {
  Version: '1.6.0_rc0',

  Browser: {
    IE:     !!(window.attachEvent && !window.opera),
    Opera:  !!window.opera,
    WebKit: navigator.userAgent.indexOf('AppleWebKit/') > -1,
    Gecko:  navigator.userAgent.indexOf('Gecko') > -1 && navigator.userAgent.indexOf('KHTML') == -1,
    MobileSafari: !!navigator.userAgent.match(/iPhone.*Mobile.*Safari/)
  },

Prototype.Browser.MobileSafari が iPhone のブラウザを判定するために利用できるようになった。

なお、iPhone に搭載されている Safari の User-Agent は

Mozilla/5.0 (iPhone; U; CPU like Mac OS X; en) AppleWebKit/420+ (KHTML, like Gecko) Version/3.0 Mobile/1A543a Safari/419.3

となっている。

Prototype.Browser の歴史

もともと Prototype.Browser は、prototype.js のあちこちに散らばっていたブラウザ判定コードを一箇所にまとめるために導入された。

その後、iPhone では Prototype.BrowserFeatures.SpecificElementExtensions が誤って true になってしまうことが発覚。対策として iPhone 判定が必要になったようだ。

ちなみに、Prototype.BrowserFeatures.SpecificElementExtensions は DOM 要素のプロトタイプチェーンに関するものだが…、ということは、iPhone に搭載されている Safari ではそのへんが変更されている？