それ、うまいのか?

... 記憶の残滓

jQuery で、P 要素を取得する

javascriptの事で教えてください。 1 2 3 4 このようなラジオボタンが有り、チェックが入った際に、 ・div.html1に予め指定した文言を表示 ・div.html2にvalueの値を出力 ・クリックされたラベルにCSSで背景色を付ける javascriptでどのように記述すればよいでしょうか。 radio1の時は あいうえお を表示 radio2の時は かきくけこ radio3の時は さしすせそ radio4の時は たちつてと radio1とradio3の時は いろは radio1とradio4の時は にほへと radio2とradio3の時は あかさたな radio2とradio4の時は はひふへほ ラベルにつけたい色は #ddd
で、

<p>
<label class="label01">
<input type="radio" name="radio1" id="radio" value="radio1" />1
</label>
<label class="label02">
<input type="radio" name="radio1" id="radio2" value="radio2" />2
</label>
</p>

<script>
if ($("#radio").checked) {      // ※ $("#radio") が undefined になる!
    ...
}
</script>

Selector に ID を指定してるのに、なんで見つからないんだ、ってしばし悩む。


そういえば、
jQueryを勉強しています。下記のようなコードを書いており、イメージとしてはpppStringをslideUp()させたいのですが動きません。文法が間違っているのでしょうか? p1String pppString ----------------------- $(function(){ $("#p1").click(function(){ var obj1 = $(".ppp", this); obj1.slideUp(); }); });
でも、

<p id ="p1">p1String
<p class ="ppp">
pppString
</p>
</p>

<script>
$(function(){
    $("#p1").click(function(){
        var obj1 = $(".ppp", this);     // ★ここで、<P> が返ってこない!
        obj1.slideUp();
    });
});
</script>

click() の中で呼んでいる jQuery 関数の第二引数 context が P 要素 (HTMLParagraphElement) だとうまく動かないらしい。
document なんかを context に指定すると、期待したとおりに動作する。

(Lhankor_Mhy)
たぶん、p要素が内部にブロック要素を持たないのがHTMLの仕様だからではないかと。おそらく、document.getElementById('p1').childNodes を見るとテキストノードしかもっていないと思います。

Selector にクラス指定をしたときには、find だったかが DOM をたどって探しにいくから見つからないんだろうなあ。
でも、ID を指定したときには、getElementById() を使ってるんじゃなかったかなあ...


きっと、また同じことで悩むんだろうなあ ><