jQuery 工具方法以及css属性与方法

                     jQuery---------工具方法以及css属性与方法
         

// jQuery 工具方法使用        

// 工具方法：
        // 1，$.each(): 遍历数组，对象，对象数组中的数据
        
        aa.  var arr = [ ]
        //a.数组的定义
        
     bb.  var arr = new Array();
        
     var names = ["姐姐","妹妹","哥哥","弟弟"]
     $.each(names,function(i,ashd){
        console.log(i,ashd);
        });
        // 获取每一个元素
        //全部打印出来
        
        //2，$.trim(): 去除字符串两边的空格
     var str = "  a   sh";
     console.log(str.lenth)
     console.log($.trim(str).lenth)
        
        // 遍历    非空格拼接  charAt（）
        
        //3，$.type(obj): 得到数据的类型
        
        console.log($.type("名字"));
        
        // 会得到String类型
        
        console.log($.type("jQuery"));
        
        // 会得到function
        
        // 4，$.isArray(obj): 判断是否是数组
        
        console.log($.isArray("[数组]"));
        
        // 5，$.isFunction(obj); 判断是否是函数
        
        console.log($.isArray("add"));
        
        // 得到true
        
        // 6,，$parsejSON(obj): 解析json字符串转换为js对象/数组
        // AJAX---无刷新技术
        var stu = '["a","b","c"]';
        console.log($.type(stu));
        // 得到String
        
        // 通过parseJSON转换
        
        var stuArr = $.parseJSON(stu);
        console.log($.type(stuArr));
        

        --------------------------------------- jQuery属性和css方法使用 ---------------------------

         <style type="text/css">
            .zy{
                border: 1px solid red;
            }
        </style>
        <ul id="oUl1">
        <li id="one">1，attr(): 获取某个标签属性的值，或设置某个标签属性的值</li>
        <li class="zy">2，removeAttr():删除某个标签属性</li>
        <li>3，addClass():给某个标签添加class属性值</li>
        <li>4，removeClass():删除某个标签class属性值</li>
        <li>5，html():获取某一个标签体内容（注意：该标签可以包含子标签)</li>
        <li><span id="sid">6，text():获取某一个标签体内容（注意：该标签体不能包含子标签)</span></li>
        <li>7，val():主要用户获取/设置输入框的值</li>
        <li>8，prop():与atte类似  区别在于prop用于属性值</li>
        <input type="text" name="" id="uu" value="666" />
        </ul>
        
        <script type="text/javascript">
        
        //1，attr(): 获取某个标签属性的值，或设置某个标签属性的值
        console.log($("#oUl1>li:first").attr("id"));
        //另类操作
        console.log($("#oUl1>li").first().attr("id"));
        ......
        //设置属性
        $("#oUl1>li:first").attr("id","nb");
        //2，removeAttr():删除某个标签属性
           $("#oUl1>li:first").removeAttr("id");.
        //3，addClass():给某个标签添加class属性值
        eq()根据下标获取位置
        $("#oUl1>li:first").addClass("zy2");
        //4，removeClass():删除某个标签class属性值
        $("#oUl1>li:first").removeClass("zy2");
        //5，html():获取某一个标签体内容（注意：该标签可以包含子标签）
        
        alert($("li").eq(4).html());
        $("#sid").parent().html("background","yellow");
        //6，text():获取某一个标签体内容（注意：该标签体不能包含子标签）
        $("#sid").parent().css("background","red");
        alert($("li").eq(0).text());
        //7，val():主要用户获取/设置输入框的值
        console.log($("#uu").val());
        </script>
        //8，prop():为boolean类型的情况 针对表单
        
        使用prop实现全选按钮
        <script type="text/javascript">
        <table border="1" cellspacing="" cellpadding="">
         <tr>
          <td colspan="4"><input type="checkbox" name="" id="all" value="" />全选</td>
         </tr>
         <tr>
                       //按钮
          <td><input type="checkbox" name="" id="" value="111" onclick=" checkeds()"/>吐血了</td>
          <td><input type="checkbox" name="" id="" value="222" onclick=" checkeds()"/>吐了</td>
          <td><input type="checkbox" name="" id="" value="333" onclick=" checkeds()"/>还好</td>
          <td><input type="checkbox" name="" id="" value="444" onclick=" checkeds()"/>。。。</td>
         </tr>
        
        
     
           $("#all").click(function(){
            var flag=$("#all").prop("checked");
            var check=$("input:checkbox:gt(0)");
            check.each(function(){
             // console.log(all.prop("checked"));
             $(this).prop("checked",flag);
            });
            
           });
           
           function checkeds(){
            var flag=true;
            var all=$("#all")
            var check=$("input:checkbox:gt(0)");
            check.each(function(){
             if($(this).prop("checked")==false){
              flag=false;
             }
            })
            all.prop("checked",flag);
           };
    </script>