认识jquery

 jQuery说白了就是javascript库

 关键词 $

 
 
    // 第一种写法
    $(document).ready(function() {

    });

    // 第二种
    $().ready(function() {

    });

    // 第三种
    $(function() {
        // 编写功能实现代码
    })

Jquery选择器

id选择器：$("#id的属性值")

类选择器：$(".class的属性值")

标签选择器：$("标签名")

并集选择器：$("选择器，选择器")

后代选择器：$("选择器   选择器")

子选择器：$("选择器 > 选择器")

属性名称选择器：$("input[type=button]")

$("选择器[属性名='值']")

$("选择器[属性名!='值']")

$("选择器[属性名^='值']") 

$("选择器[属性名$='值']")

$("选择器[属性名*='值']")

首元素选择器：${选择器：first}

尾元素选择器：${选择器：last}

偶数选择器：${选择器：even}

奇数选择器：${选择器：odd}

等于索引选择器：${选择器：eq(index)}

大于索引选择器：${选择器：gt(index)}

小于索引选择器：${选择器：lt(index)}

单复选框：${:checked}

全部选中以及反选

    $(function() {
        $("#th").click(function() {
                var th1 = $("#th").prop("checked");
                // 获取全部复选框选中状态
                $("tr td #th1").prop("checked", "th1");
                // 获取下面的checkbox
            })
            // 单击下面的复选框
        $("tr td #th1").click(function() {
            // 第一个值,除了全选意外下面有多少个checkbox
            var th = $("tr td #th1").length
                // 第二个值,获取被选中的复选个数:checked
            var count = $("tr td #th1:checked").length
                // 判断全部复选框的值与复选框个数的值是否相等
                // 则全选的checkbox设置选中状态
            if (count == th) {
                $("#th").prop("checked", true);
            } else {
                $("#th").prop("checked", false);
            }
        })

        // 反选
        $("#btn1").click(function() {
            // console.log(tt);
            $("tr td #th1[type=checkbox]").each(function() {
                this.checked = !this.checked;
                var th = $("tr td #th1").length
                    // 第二个值,获取被选中的复选个数:checked
                var count = $("tr td #th1:checked").length
                    // 判断全部复选框的值与复选框个数的值是否相等
                    // 则全选的checkbox设置选中状态
                if (count == th) {
                    $("#th").prop("checked", true);
                } else {
                    $("#th").prop("checked", false);
                }
            })
        })

 attr方法和prop方法

 $(function() {
        $("#div_0").click(function() {
            // attr(属性名):可以获取到标签的属性值(非布尔值)
            // attr(属性名,属性值) 用来设置标签的的属性值(非布尔值)
            $("#div_0").attr("class", "div0")
        })
        $("input[type='button']").click(function() {
            // prop(属性名) 只能获取布尔类型的值
            $("input[type='checkbox']").prop("checked", "true");
        })
    })