Life is a Flower.

詩の話とかWebっぽい話とか、とにかく雑多に。

2009年01月08日

innerHTMLとかのテスト

その筋では既知っぽいっていうか、調べてみたら既知だった挙動テストその3。「HereClick!」というボタンを押すと何も入っていないプルダウンメニューに「OPTION 01」「OPTION 02」「OPTION 03」という選択肢が出現します(生成された際に表示される値は「OPTION 01」)。IE以外は!!

このJavaScriptのコードは以下の通り。

<script>
<!--
function test_button_02() {
    var html;
    var values = new Array("OPTION 01", "OPTION 02", "OPTION 03");
    for (var i = 0; values[i]; i++) {
        html += '<option>' + values[i] + '</option>';
    }
    var node = document.getElementById('test_select_02');
    node.innerHTML = html;
}
-->
</script>
<form>
<select id="test_select_02">
</select>
<input type="button" onClick="test_button_02()" value="HereClick!">
</form>

えー、IEではselectタグの中にJavaScriptで動的に直接optionを追加できません。なんでこういうことになるのか、さっぱり意味が分かりませんorz

ついでに、もう一つテスト。

下のボタンを押すとこの段落の内容がアラート・ウィンドウ表示されます、普通のブラウザの場合。

これもJavaScriptのコードは以下の通り。

<script>
<!--
function test_func_03() {
    var isMSIE = /*@cc_on!@*/false;
    var node   = document.getElementById('description');
    if (isMSIE) {
        alert(node.content);
    }
    else {
        alert(node.firstChild.nodeValue);
    }
}
-->
</script>
<div>
    <input type="button"
        onClick="test_func_03()" value="押してみて?">
</div>

idが"description"のタグを探して来いって指定してるのに、なんでIEはnameが"description"のmetaタグを拾ってくるんだよ!! IEのこのいい加減な挙動をどうにかしてぇ><

投稿時刻: 23:52 | カテゴリ: /web/html | 固定リンク

2008年09月23日

selectのテスト

その筋ではとても既知っぽい挙動テストのその2。こんなエントリーばっかりですみません。仕事がまぢきついんで、今はこういうネタしか持ち合わせてないんですよ。

このプルダウンメニューを表示させてるHTMLは以下の通り。

<form>
<div>
<select id="test_select_01" onChange="javascript:alert(this.value)">
    <option disabled selected>-- どれか選んでね --</option>
    <option>選択肢 1</option>
    <option>選択肢 2</option>
    <option>選択肢 3</option>
</select>
</div>
</form>

プルダウンメニューの選択肢を変えた際にアラートで value の値を表示するって指定。

option要素ってvalue属性が指定されていない場合はoption要素の内容をvalueの値として扱うんじゃなかったっけ?

要は「選択肢 n」(nは選択したoptionの数字)がアラートで表示されなきゃいけないってことなんだけど、IE7はしっかり期待を裏切ってくれます。謎。更に言うとIE7ではoption要素内のdisabled属性(選択不可)が機能してない気がする。

ちなみに、さすがにこれだとIE7でも大丈夫(disabled属性が機能してないのは相変わらずですが)。

<form>
<div>
<select id="test_select_02" onChange="javascript:alert(this.value)">
    <option disabled selected>-- どれか選んでね --</option>
    <option value="選択肢 1" label="1">選択肢 1</option>
    <option value="選択肢 2">選択肢 2</option>
    <option value="選択肢 3">選択肢 3</option>
</select>
</div>
</form>

私の中で「これはひどい」認定してる仕事(今やってる仕事)で扱ってるWebページを触ってて気づいたんだけど、こういうフォーム回りの挙動の違いってWebアプリを作る際に困るなぁ。

【追記】2008-09-24T13:30:00+09:00

代わりにIE7って、option要素のlabel属性はちゃんと処理できるんだね。IEで二つめのプルダウンメニューのうち、1つめの選択肢(「どれか選んでね」は除く)が1とだけ表示されてるんはその影響です。

投稿時刻: 12:45 | カテゴリ: /web/html | 固定リンク

2008年09月15日

buttonのテスト

その筋ではとても既知っぽい挙動テスト。

このボタンを表示させてるHTMLは以下の通り。

<form>
<div>
    <button type="button" id="test" value="TEST"
    onClick="javascript:alert(this.value)">テストだよ</button>
</div>
</form>

クリックされた際にアラートで value の値を表示するって指定なのに、valueの値ではなく「テストだよ」とアラートを出すIE7の挙動はおかしいと思う。

今はもぅ対応済みだけど、IEで公開中ニコニコ動画マイリストのランダムボタンをクリックしても動かなかったわけだわ。

投稿時刻: 13:33 | カテゴリ: /web/html | 固定リンク

2003年07月27日

問題波及。

ValidなHTMLの認知度って?で取り上げた件が結構波及している様子。

答え側の朝日新聞Be編集部も問題だったのは、文法を守らないことよりも、適当な推測を根拠に「"見出しと本文の数字の指示の仕方が逆というのは、ほとんど嫌がらせかとも思えますが"」と書いたことに気が付くべき。近頃の記者は事実確認とか、何が問題になっているのかを分析することもできないくらい落ちぶれたのか。

グランド・ウェブ! ファンキー 井戸端会議

そりゃまぁ、そうなんだけど。というのを前提に、ただ実感として「認知しないところはないのと一緒」という解釈というか、「(自身の)知識の欠落は他人のせい」っていう風潮が妙に一般的になったような錯覚を感じないわけでもなく。

追記(2003-07-23T14:35:00+09:00)

なんか読み返してみると、どうも私、話の本筋から反れたところを取り上げている感じ。問題なのは適当な推測を根拠に「ほとんど嫌がらせかとも思えますが」と評した部分、なんですよね。

えと。そういうことで。

投稿時刻: 18:27 | カテゴリ: /web/html | 固定リンク

2003年07月22日

ValidなHTMLの認知度って?

h1 〜 h6 は見出しを示す要素で、1〜6 の数字は見出しのレベルを表しています。このレベルは文字のサイズとは関係ありません。多くのブラウザのデフォルトスタイルが、たまたま文字サイズの変化で見出しレベルの差異を表しているというだけです。表示の仕方が逆も何も、そもそも文字サイズとは関係ないのです。

こういった基本的な概念も理解せずに「嫌がらせかとも思えます」などと書いてしまったりするような人は、もう 3年くらい前に絶滅したものとばかり思っていました。

えび日記

私もなるべくValidなHTMLの記述を心掛けるようにしている方ではあるけれど、実際のところこういう部分を問題視できるほどHTMLの仕様ってそんな認知されているんだろうかという疑問も一頻り。

記事を書く立場の人間がその仕様を理解していないという方が問題だということなのだろうけど。事実そうなんだけど。

話の経緯がよく分からない気がしたので追記すると、上記引用部分は

図【4】の4行目の<H1>は、見出しであることを表しています。Hに続く数字は1から6まで。数字が小さいほど、文字は大きく強調されます。6行目の数字は本文の文字サイズを指示しています。1から7までありますが、こちらは数字が大きいほど文字が大きくなります。見出しと本文の数字の指示の仕方が逆というのは、ほとんど嫌がらせかとも思えますが、ここは淡々と行きましょう。

夏休みホームページ作り(上)

に対する発言。

投稿時刻: 14:22 | カテゴリ: /web/html | 固定リンク

Contents

RESOURCES

小説・その他

ニュース

PC Tips and Help

WWW, (X)HTML & CSS

Accessibility & Usability

セキュリティ関連

スポーツ

GAME, Comic & Anime

ETC