作者: davi
日時: 2009/2/15(03:04)
みなさん  <  こん??は でび@義理チョコはローソンのやつだったorz です

例によって、OK WAVE的ネタであります。

# 実は、OK WAVEとかの発言ID取得って、やり方がよくわからんのですよね…。
# 楽天IDとかYahoo!IDとかでそのまま入れるのでしょうか。
# お返事にポイント、ってのも、仕組みがよくわからん。

-------------------
○Javascriptその1
# documentElementのネタ元は、オータム川俣晶大人のハック。
# ブラウザの切り分けをしないで良い点が楽ちん。

function ClientSize() { 
    alert( "描画領域の幅 width:" + document.documentElement.clientWidth + "pixel ,
           描画領域の高さ height:" + document.documentElement.clientHeight + "pixel" );

    alert( "描画領域の幅 width:" + document.getElementById("right_menu").clientWidth +
           "pixel , 描画領域の高さ height:" + document.getElementById("right_menu").clientHeight +
           "pixel" );
}

結果:
documentElementで取ると、画面全体のwidthとheightの両方がチャンと取れる。
getElementByIdで取ると、<div right_menu> のwidthは取れるが、heightは0が返る。

よってright_menuの領域を取りたい場合は、

widthはgetElementByIdでright_menuで取る。
heightは妥協してdocumentElementで画面全体の高さで取る。

上記は、IE7、Firefox2ともに正常に動きました。

-------------------
○Javascriptその2(でびの応用)

function SetWidthHeightSize(){
    var RMW = document.getElementById("right_menu").clientWidth;
    var RMH = document.documentElement.clientHeight;
    var OTRMW = '"width","' + RMW + '"' ;
    objectTag.setAttribute(OTRMW);

    var OTRMH = '"height","' + RMH + '"' ;
    objectTag.setAttribute(OTRMH);

alert(RMW);
alert(RMH);
alert(OTRMW);
alert(OTRMH);
}

さて、Javascriptその1を踏まえて、上記のようにしてみました。
IE7、Firefox2ともに動きません。

IEの場合は、エラーが出てもその先に進むので、アラートが
表示されますが、その表示結果を見た感じでは、文字列生成に
ついては上手くいっているようです。

Firefox2のエラーコンソールによると、

>エラー: uncaught exception: [Exception... "Not enough arguments"
> nsresult: "0x80570001 (NS_ERROR_XPC_NOT_ENOUGH_ARGS)"
> location: "JS frame ::file:///〜/hoge.html ::
>SetWidthHeightSize :: line 123"  data: no]

とか意味不明な無愛想なエラーを返してきます。
setAttributeに放り込んだユーザ定義変数が、うまく展開されて
いないのか?という印象です。

-------------------
○検証用Javascriptその3(古籏DOM本 Rist3.38をちょっと改変。)

上記とは別のファイルとして作成。
以下のコードは、ちゃんと動きました。

function apChild(){
    var mItem = ["国語","算数","理科","社会" ];
    var ulTag = document.getElementById("classList");
    for (i in mItem){
        var liTag = document.createElement("li");
        var tNode = document.createTextNode(mItem[i]);
        liTag.appendChild(tNode);
        ulTag.appendChild(liTag);
    }
}


<body onload="apChild();">
<h1>appendChild</h1>
<ul id="classList"></ul>
</body>

-------------------
○考察

以上の実験から帰納して、「"」の展開が上手くいっていないのかなぁ?
と考え、実体参照文字列「&quot;」で置き換えてみたり、
string = new String(string) で、

objectTag.setAttribute(new String(OTRMW) );

とやってみましたが、どうも上手く行かない…。

Perlとかだと、想定外の所でも展開されてしまってビックリするような
場合すらありますが、各種ブラウザのJavascriptとDOM実装は、どうも、
そんな感じとも違うようです。

上記「その2」のコードが動くようにするには、何か必要か、
ご存じの方、ご教示ください。

でび  http://davi.txt-nifty.com/1984/