jquery入门指南（二）

toggle：如果被选元素可见，则隐藏这些元素，如果被选元素隐藏，则显示这些元素。
语法：$(selector).toggle(speed,callback,switch)

淡入淡出： fadeIn fadeOut
下拉显示： slideUp slideDown
--不推荐使用

动画：animate
--推荐使用

样式：
.css('width'); //获取一个样式，带单位 200px
.css('background','yellow'); //设置一个样式
.css({'background':'yellow','width':200}); 设置多个样式

 <script src="js/jquery-1.7.2.js"></script>
    <script>
        $(function(){
            alert($('div').eq(0).css('width'));
        });
    </script>

属性：
.attr('属性名') //获取一个属性
.attr('name','value'); //设置一个属性
.attr({
name1:'v1',
name2:20
}) //批量设置属性

class操作：
addClass
removeClass

<script src="js/jquery-1.7.2.js"></script>
    <script>
        $(function(){
            $('#btn1').click(function(){
                //$('#div1').addClass('aa');
                $('#div1').removeClass('aa');
            });
        });
    </script>

内容操作：
非表单元素的内容：
.html() 获取innerHTML
.html(设置的内容) 设置
表单标签：
.val() 获取内容
.val(设置的内容) 设置

<script src="js/jquery-1.7.2.js"></script>
    <script>
        $(function(){
            $('#btn1').click(function(){
                //alert($('#div1').html());
                $('#div1').html('123456789');
            });
        });
    </script>
<body>
<input type="button" id="btn1" value="aaaa">
<div id="div1">123</div>

原生对象 jquery对象

原生对象的属性和方法，不能直接用于 jquery对象
jquery对象的属性和方法，不能直接用于原生对象
原生对象转化为 jquery 对象 $(原生)
jquery对象转化为原生对象 $( )[0]

索引：
.index();

<script src="js/jquery-1.7.2.js"></script>
    <script>
        $(function(){
            alert($('.on').index());
        });
    </script>
<body>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li class="on"></li>
        <li></li>
        <li></li>
    </ul>
</body>

链式操作：分步骤地对jQuery对象实现各种操作.

<script>
        $(function(){
            $('input').click(function(){
                //$('#div1').css('width',200).hide().css('height',300).show();
                $('#div1').animate({'width':200}).hide();
            });

        });
    </script>
<body>
<input type="button" value="aaa">
<div id="div1"></div>
</body>

兄弟节点：siblings
函数用于选取每个匹配元素的所有同辈元素(不包括自己)，并以jQuery对象的形式返回。如果没有符合条件的元素，则返回空的jQuery对象。

jquery入门指南（二）

推荐阅读更多精彩内容