IEでswfを複数読み込んでいる場合の$('object:first').find('param')が正常に動作しない件に関して

名字を検索するとサジェストに「読み方」が表示されます。agoです。

mist.jsでIEがswfを複数読み込んでいる場合に$('object').find('param').lengthが$('object:first').find('param').lengthと同じ値になる問題がありその内容に関して調査してみました。

症状

以下のようなtagを読み込んでいるとき、IEで$('object:first').find('param').lengthすると4が返ります。
（IE以外の場合、2が返る）

サンプル

<object data="http://wonderfl.net/swf/index.swf" width="100" height="100" type="application/x-shockwave-flash">
    <param name="movie" value="http://wonderfl.net/swf/index.swf" />
    <param name="flashvars" value="object1" />
</object>
<object data="http://www.kayac.com/swf/dice.swf" width="100" height="100" type="application/x-shockwave-flash">
    <param name="movie" value="http://www.kayac.com/swf/dice.swf" />
    <param name="flashvars" value="object2" />
</object>

jQueryなしだと？

jQueryを読み込まず、document.getElementsByTagName('object')[0].getElementsByTagName('param').lengthを行っても4が返ります。

サンプル

object tagを増やすと？

以下のようなtagの場合、$('object:first').find('param').lengthは6を返します。

サンプル

<object data="http://wonderfl.net/swf/index.swf" width="100" height="100" type="application/x-shockwave-flash">
    <param name="movie" value="http://wonderfl.net/swf/index.swf" />
    <param name="flashvars" value="object1" />
</object>
<object data="http://www.kayac.com/swf/dice.swf" width="100" height="100" type="application/x-shockwave-flash">
    <param name="movie" value="http://www.kayac.com/swf/dice.swf" />
    <param name="flashvars" value="object2" />
</object>
<object data="http://www.kayac.com/swf/dice.swf" width="100" height="100" type="application/x-shockwave-flash">
    <param name="movie" value="http://www.kayac.com/swf/dice.swf" />
    <param name="flashvars" value="object3" />
</object>

何が取得されている？

var result = '';
$('object:first').find('param').each(function () {
    result += this.name + ' = ' + this.value + '\n';
});
alert(result);

上記のコードを実行すると以下のような結果が得られます。
（object tagが3つある場合）

サンプル

movie = http://wonderfl.net/swf/index.swf
flashvars = object1
movie = http://www.kayac.com/swf/dice.swf
flashvars = object2
movie = http://www.kayac.com/swf/dice.swf
flashvars = object3

原因は？

IEがobjectに対してgetElementsByTagNameを行うと、document.getElementsByTagNameと同じ結果を返しているのが原因のようです。

回避方法

$('object:first').children('param').lengthは正しく2を返すので、IEで複数objectが存在する場合にparam要素を取得したい場合、childrenを使いましょう。
（document.getElementsByTagName('object')[0].childNodes.lengthも正しい値を返します）

サンプル

カヤックではめげない技術者も募集しています！