デザイナーにも分かりやすいjQuery入門講座|jQueryの使い方

このエントリーをはてなブックマークに追加
索引
Core:コアとなる仕組み
Selectors:セレクタ
Attributes:属性
Traversing:対象の変更
Manipulation:操作
CSS:スタイルシート
Events:イベント
Effects:演出効果
Ajax:xml等との連携
Utilities:ユーティリティ
Data:データ
Miscellaneous:諸々
Deferred:処理管理
Callbacks:コールバック
Internals:内部処理

jQuery.supportブラウザのサポート情報

構文

ブラウザのサポート情報返値:objectオブジェクト
jQuery.supportver1.3〜

機能

jQuery.supportプロパティはブラウザがサポートしているか否かの情報を保持しています。情報はobjectオブジェクトで返され、非常に多くのプロパティを持っています。詳細は「解説」で説明します。

解説

機能ごとのリストを表示

まずはjQuery.supportが返すプロパティがどのような情報を持つかeachメソッドを利用して列挙します。サンプル(support/01.html)を開いてbody内にbutton要素しかないことを確認してください。

jQueryは以下の様に記述され、eachメソッドを利用してjQuery.supportプロパティの持つプロパティと各値をappendメソッドを利用してbody要素に追加していきます。

$("button").click(function(){
	$.each($.support, function(prop, value){
		$("body").append(prop + " : " + value + "<br/>");
	})
});

結果として、次項で紹介する「機能」をブラウザがサポートしているか否かをtrue/falseで表示します。

jQuery.supportプロパティが保有するプロパティ

サンプルsupport/01.htmlで書き出されたプロパティをもとにリストを作成しましたが、本家ページに載っていないため詳細の分からないプロパティもあります。

leadingWhitespace
innerHTMLで値を取得する際、先頭の空白をそのまま返す場合はtrueを返します(現状IE6〜8でfalseとなります)。
tbody
テーブルを作成する場合<tbody>がなくても良い場合はtrueを返します(現状IEではfalseとなります)。もしfalseなら<tbody>を入れるようにしましょう(IEでは自動的に入れてくれます)。
htmlSerialize
innerHTMLを使用してリンク要素の値を取得する際に、シリアライズされる場合はtrueを返します(現状IEではfalseとなります)。
style
getAttribute('style')で要素のスタイル属性を取得できる場合はtrueを返します。IEではfalseとなり利用できないので、代わりにcssTextメソッドを利用してください。
hrefNormalized
getAttributeメソッドを使用してhref属性値を取得する際、href属性値を変更(ノーマライズ)しない場合はtrueを返します。IEではノーマライズされるためfalseとなります。
opacity
opacityプロパティで透明度を指定できる場合はtrueを返します。現状IEではfalseとなり利用できないので、代わりにalpha filtersを利用して下さい。
cssFloat
CSSのfloatの値をcssFloatプロパティで取得できる場合にはtrueを返します。現状IEではfalseとなり利用できないので、代わりにstyleFloatを利用して下さい。
checkOn
チェックボックスのデフォルト(何も設定されてない時)の値が"on"になる場合にはtrueを返します。
optSelected
デフォルトで選択されているoption要素にselectedプロパティが機能する場合はtrueを返します。
getSetAttribute
本家ページに記載なし。
enctype
本家ページに記載なし。
html5Clone
本家ページに記載なし。たぶんhtml5に対応しているか否かだと思います。
boxModel
W3Cの「CSS Box Model」に準じたレンダリングをする場合はtrueを返します。Quirks(互換)モードのIE6,7の互換モード(Quirks Mode)ではfalseになります。documeny readyイベントが発生するまで値は取得できません(nullとなります)。このプロパティはv1.10で削除されました(もはやjQueryはIE6,7をサポートしていません)
submitBubbles
submitイベントがバブリングする場合はtrueを返します。現状IEではfalseとなりますがjQueryのフォローでバブリングされます。
changeBubbles
changeイベントがバブリングする場合はtrueを返します。現状IEではfalseとなりますがjQueryのフォローでバブリングされます。
focusinBubbles
本家ページに記載なし。たぶんfocusinイベントがバブリングするか否かだと思います。
deleteExpando
本家ページに記載なし。存在しないプロパティを削除しようとしてもエラーにならない場合はtrueを返します。たぶん。
noCloneEvent
要素をコピーする際、イベントハンドラをコピーしない場合はtrueを返します。現状IEではfalseになります。
inlineBlockNeedsLayout
本家ページに記載なし。たぶんcssのdisplay属性でinline-blockに対応していないとtrueを返すのだと思う。
shrinkWrapBlocks
本家ページに記載なし。
reliableMarginRight
本家ページに記載なし。
boxSizingReliable
本家ページに記載なし。
pixelPosition
本家ページに記載なし。
noCloneChecked
要素をコピーする際、checkedの状態もコピーする場合はtrueを返します。現状IEではfalseになります。
optDisabled
無効(disabled)のselect要素内にあるoption要素が自動的に無効(disabled)にならない場合はtrueを返します。
radioValue
本家ページに記載なし。
checkClone
ラジオボタンやチェックボックスの状態をブラウザが正しく複製できる場合はtrueを返します。
appendChecked
本家ページに記載なし。
ajax
ブラウザがXMLHttpRequestオブジェクトを作成できる場合はtrueを返します。
cors
ブラウザがXMLHttpRequestオブジェクトを作成でき、それがwithCredentialsを持っている場合がtrueを返します。corsをサポートしていない環境でクロスドメインリクエストをしたい場合は「$.support.cors = true;」と設定して下さい。
reliableHiddenOffsets
本家ページに記載なし。たぶん隠れた要素のoffsetの値が取れるか否かだと思います。
boxSizing
本家ページに記載なし。たぶんcssのbox-sizingが設定できるか否かだと思います。
doesNotIncludeMarginInBodyOffset
本家ページに記載なし。たぶんbody要素のoffset値にマージンを含んでいないか否かだと思います。

関連項目

v1.3でjQuery.supportプロパティが追加されたため、jQuery.boxModelプロパティjQuery.browserプロパティは廃止となりました。