JQuery: Javascript Query, js的查询插件
    通过js文件中的函数, 为window对象添加了新的属性$和jQuery.
    通过$或jQuery调用jquery插件的各种方法

    1. 获取标签对象
        1) 通过$("jquery选择器")获取标签对象
            注: 通过jquery函数获取到的标签对象和通过js dom获取到的标签对象是不一样的

        2) jquery标签对象和js标签对象之间的互相转换
            [1] js转成jquery
                let tag = document.getElementById("show");
                let $tag = $(tag);
            [2] jquery转成js
                let tag = $tag[0];

    2. jquery选择器
        1) 基础选择器: 标签, 类, id
            [1] 标签: let $div = $("div");
            [2] 类: let $btn = $(".btn");
            [3] id: let $no1 = $("#no1");

        2) 高级选择器:
            [1] 并集: let $tag = $("#test, .modfiy, #no2");
            [2] 后代: let $tag = $(".btn input");
            [3] 属性:
                    let $tag = $("[name]");
                    let $tag = $("[name='userName']");
                    let $tag = $("[name^='user']");
                    let $tag = $("[name$='password']");
                    let $tag = $("[name*='a']");
        3) 伪类:
            [1] 根据位置筛选
                i.   :first, 第一个
                ii.  :last, 最后一个
                iii. :eq(下标), 获取指定下标的元素
                iv.  :even, 获取偶数下标的元素
                v.   :odd, 获取奇数下标的元素
                vi.  :lt(下标), 获取比指定下标小的元素
                vii. :gt(下标), 获取比指定下标大的元素

            [2] 根据功能筛选
                i.   :text, 获取文本框
                ii.  :password, 获取密码框
                iii. :button, 获取按钮
                iv.  :reset, 获取重置按钮
                v.   :submit, 获取提交按钮
                vi.  :checkbox, 获取多选框
                vii. :radio, 获取单选框
                viii.:file, 获取文件选择框
                viii.:hidden, 获取隐藏的元素
                ix.  :checked, 获取选中的选项
                x.   :selected, 获取选中的选项
                xi.  :disabled, 获取禁用的元素

    3. 绑定事件
        1) 为标签绑定事件
            [1] 标签对象.on("事件名", 执行函数);
            [2] 标签对象.bind("事件名", 执行函数);
            [3] 标签对象.事件函数(执行函数);
                    标签对象.click(执行函数)
                    标签对象.change(执行函数)
                    标签对象.blur(执行函数)
                    ....
        2) 解除事件绑定
            标签对象.unbind("事件名");

    4. 操作元素的属性和内容
        1) 操作value属性:
            取值: let msg = 标签对象.val()
            赋值: 标签对象.val("值")
        2) 操作标签内容
            取值: 标签对象.html(), 标签对象.text()
            赋值: 标签对象.html("内容")
        3) 操作行内样式
            标签对象.css("样式属性", "值")
            标签对象.css({
                "样式属性1":"值1"
                , "样式属性2":"值2"
                , "样式属性3":"值3"
                , ........
                , "样式属性n":"值n"
            })
        4) 操作class属性
            标签对象.addClass("class名")
            标签对象.removeClass("class名")
            标签对象.hasClass("class名"), 返回true/false
        5) 其它属性和自定义属性
            取值: 标签对象.attr("属性名")
            赋值: 标签对象.attr("属性名", "值")
        6) 遍历
            标签数组.each(function(){

            })
        7) 获取标签对象附近的元素
            获取下一个标签对象: 标签对象.next()
            获取上一个标签对象: 标签对象.prev()
            获取父元素对象: 标签对象.parent()
        8) 在标签对象的子元素中根据选择器要获取标签对象/数组
            标签对象.find("选择器");
        9) 获取表单数据的参数字符串
            表单标签对象.serialize(), 返回字符串

    5. 添加新元素
        1) 创建新标签对象
            let $new = $("<div></div>");
            let $new = $("<input>");
        2) 添加到页面指定位置
            [1] 追加到父元素末尾: 父元素.append(新元素)
            [2] 添加到父元素开头: 父元素.prepend(新元素)
            [3] 插入到指定元素之后: 指定元素.after(新元素)
            [4] 插入到指定元素之前: 指定元素.before(新元素)

    6. 删除元素
        1) 清空子元素: 父元素.empty()
        2) 删除标签: 标签对象.remove()