+ -
当前位置:首页 → 问答吧 → 学了几天JQ,挖出2个问题……

学了几天JQ,挖出2个问题……

时间:2009-03-22

来源:互联网

问题1:
   <ul>
        <li>A
            <ul>
                <li>1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
            </ul>
        </li>
        <li>B
            <ul>
                <li>1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
            </ul>
        </li>
        <li>C
            <ul>
                <li>1</li>
                <li>2</li>
                <li>3</li>
                <li>4</li>
            </ul>
        </li>
    </ul>
   
    <script type="text/javascript">
        $("ul li:nth-child(2)").css("color","Red");/* B以及2全部列为红色字体 */
        $("ul li:nth-child(1)").css("color","Green"); /* A以及所有1全部列为绿色 */
    </script>


结果:

A
    1 2 3 4
B
    1 2 3 4
C
    1 2 3 4
问题2:


    <button id="show">显示</button>
    <button id="hide">隐藏</button>
    <p style="visibility:hidden">这是一段隐藏的文本。style="visibility:hidden"</p> <!-- 对该属性无效 -->
    <p style="display:none">这是一段隐藏的文本。style="display:none"</p>
    <script type="text/javascript">
        $("button:#hide").click(function()
        {
            $("p:visible").hide() /* 同等于: $("p:visible").css("display","none"); */
        });
        $("button:#show").click(function()
        {
            $("p:hidden").show() /* 同等于: $("p:hidden").css("display","block"); */
        });
    </script>

1
结果(单击"显示"懒得截图,自己去试):
显示隐藏

显示隐藏
这是一段隐藏的文本。style="display:none"


-------------不可否认的JQ强大……嘿嘿!我喜欢!

作者: aloner   发布时间: 2009-03-22

天哦……效果没显示出来,你们贴代码去试试。

作者: aloner   发布时间: 2009-03-22

呵呵,看得出来,楼主很兴奋啊

作者: shawphy   发布时间: 2009-03-22

喜欢咯。
又挖出一个了。。
:hidden有冲突。

<p><input type="hidden" value="隐藏的对象Hidden" /></p>
<p><input type="button" value="隐藏的对象Button"style="display:none;" /></p>

单单只用:hidden,会把两个显示出来。

作者: aloner   发布时间: 2009-03-22

才疏学浅啊`完全看不明白`

作者: gordianyuan   发布时间: 2009-03-23

在firefox下,hidden还能匹配script之类的标签呢!

作者: shawphy   发布时间: 2009-03-23

$(document.body).prepend("<p>一段文字4</p>").addClass("odd");

见鬼般无效!

作者: aloner   发布时间: 2009-03-25

die()事件似乎无法取消某些(不排除我代码有误)
unbind()事件无法解绑所有带有命名空间的事件。<<<无奈!

作者: aloner   发布时间: 2009-03-25

        $(document.body).prepend("<p id='p4'>一段文字4</p>").addClass("odd");
        alert($("p4").attr("className"));
        弹出——undefined

作者: aloner   发布时间: 2009-03-25

呵呵

作者: css8wusan   发布时间: 2009-03-31

$("#p4").attr("className")

你漏了"#"号当然弹出undefined
而且你把class添加到body上而不是p标签上

作者: gordianyuan   发布时间: 2009-03-31